Récupérer une image en fonction d'une propriété CSS

Bonjour,

J'ai un petit soucis qui ne parait compliqué mais qui me bloque ;)

Code:

---

<img id="interrogeablefranceRaster" class="interrogeable" src="images/spacer.gif" style="background-image: url(images/tree/iconeInfo.png); background-position: center top; height: 12px; width: 12px;" onclick="interrogeableOuNon(this);"/>

---

En gros je voudrais récupérer cette image. La chose discriminante est en rouge. Les autres images ont un autre aspect et ont un code de ce type :

Code:

---

<img id="interrogeablefranceRaster" class="interrogeable" src="images/spacer.gif" style="background-image: url(images/tree/iconeInfo.png); background-position: center bottom; height: 12px; width: 12px;" onclick="interrogeableOuNon(this);"/>

---

Je voudrai donc récupérer l'image qui a pour attribut background-position: center top.

Merci de votre aide, je continue à tester dans mon coin

Bien le bonsoir,

En fait un style n'a pas à être porteur de logique.
Si tu souhaites extraire une image, il faut lui donner un autre caractère discriminant (un nouvel attribut html, une position précise dans un autre noeud ...).

Que puis-je rajouter comme attribut html discriminant ?

Et sinon ce n'est pas possible de récupérer une image avec un attribut CSS particulier avec JQuery ?

Salut,

+1 avec khayyam90

Je pense qu'il serait plus judicieux de créer un classe css pour
appliquer le style background-position, par exemple:

Code:

---

.toto { background-position: center top; }

---

EDIT: background-position: top; suffit, ça le centre horizontalement

et d'appliquer cette classe aux images concernée ainsi:

Code:

---

<img id="interrogeablefranceRaster" class="interrogeable toto" ... />

---

Ensuite tu peux facilement sélectionner les images concernées
avec un sélecteur JQuery du genre $('img.toto')

En suposant qu'il y aie qu'une image qui corresponde dans ta page (si j'ai
bien compris ta question) tu peux essayer ceci

Code:

---

1 2	var image_url = $('img.toto').attr('src');

---

Si tu ne peux pas procéder ainsi, alors tu peux toujours essayer un
sélecteur JQuery qui se base sur la présence d'une certaine valeur
à l'intérieur d'un attribut, par exemple:

Code:

---

1 2	var image_url = $("img[style*='center top']").attr('src');

---

Oui du coup c'est ce que j'ai fait sauf que j'ai mis un attribut name dans l'image mais c'est vrai que j'aurai pu mettre 2noms de classes je n'y avais pas pensé.

Merci