jQuery - comment obtenir/lire la propriété css sur: hover pseudo class

Question

Je travaille sur un préchargeur d'image qui va précharger toutes les images sur une page. Mon approche est la suivante:

onDomReady, boucle à travers $("*") // passer par tous les éléments lorsque le DOM est prêt

• si $(this).tagName.toLowerCase() == 'img', lisez attribut src et précharger cette image
• else if $(this).css("background-image") != "none", lire le prop de l'image d'arrière-plan et précharger cette image

Mon problème est que cette approche ne reprend pas sur la classe: hover, qui est normalement l'image qui aurait besoin de t o être préchargé de toute façon. Ce que je voudrais faire, c'est pouvoir, en parcourant tous les éléments, vérifier l'existence de la pseudo-classe: hover, puis vérifier l'existence de la propriété "background-image" sur cette classe. Je voudrais vraiment m'en tenir à cette approche, car elle a) me permet de ne pas avoir à spécifier explicitement chaque image que je veux précharger, et b) prend soin des chemins relatifs dans le CSS, comme la lecture de la La propriété "background-image" me donne le chemin relatif à la page.

Alors, ma question est la suivante:

Est-il possible, en utilisant jQuery, pour lire les propriétés CSS sur la classe: hover pseudo pour un élément? Je n'ai aucune suggestion?

Merci!

Answer 1

Cela va être très intensif lors du chargement de la page pour rechercher dans toutes les images DOM/CSS ... ce n'est probablement pas une bonne idée sur un site public. Une bonne alternative est d'utiliser des images-images (http://www.google.com/images/nav_logo26.png) et de les positionner avec CSS

Answer 2

Il semble que les sprites soient la bonne solution à ce problème. Mais si elles ne peuvent pas être implémentées pour une raison quelconque, ce que vous voulez faire est d'accéder à la collection document.styleSheets pour rechercher des règles avec: hover dedans. This page vous aidera à démarrer.