Informaticien - [CSS/HTML] Une combobox d'images?

26/12/2007 @ 11:55:15: zion: [CSS/HTML] Une combobox d'images?

J'ai cherché, j'avais cherché et j'ai rien trouvé de simple... Y a vraiment pas moyen de placer des images dans une combo au lieu d'un texte? :oh:

J'ai besoin de laisser un choix entre une vingtaine d'images (ou plus) à l'utilisateur, je me vois mal lui laisser ce choix via des radiobutton et tout afficher, et j'ai vraiment pas envie d'aller programmer un truc tout compliqué pour ça :sweat:

Y a vraiment pas moyen? :oh:

26/12/2007 @ 12:12:25: max: [CSS/HTML] Une combobox d'images?

background-image dans <option> ?

26/12/2007 @ 12:16:54: zion: [CSS/HTML] Une combobox d'images?

max> De ce que j'ai lu, cela ne fonctionnait pas, je n'ai pas testé par fainéantise du coup.

*Je teste*

En effet, cela ne fonctionne pas génial. Sous Firefox on arrive à avoir une image, mais si on la sélectionne le style n'est pas copié sur le choix, donc on a un truc tout pourri. Sous IE on n'a tout simplement aucune image :spamafote:

Au mieux sous IE j'ai un fond en couleur en utilisant le background-color, mais pas d'image :sweat:

26/12/2007 @ 12:35:47: ovh: [CSS/HTML] Une combobox d'images?

http://xhtml.developpez.com/faq/?page=select#SELECT_image :sad:

26/12/2007 @ 12:46:10: zion: [CSS/HTML] Une combobox d'images?

Ce n'est pas possible. Les listes déroulantes ne peuvent contenir que du texte.

Mon cul, dans la norme CSS-2, le background-image peut être appliqué à n'importe quel élément, en théorie on doit donc pouvoir appliquer cela à un <option>, juste que l'équipe d'IE a pas décidé le faire :oh:

Mais bon dans Opera ça fonctionne pas non plus (pas avec mon 9.22 en tout cas) :figti:

'background-image'
Value: <uri> | none | inherit
Initial: none
Applies to: all elements
Inherited: no
Percentages: N/A
Media: visual
Computed value: absolute URI or none

Donc il faut supposer qu'Opera ne supporte pas non plus le CSS2 au complet, comme ce bon vieil IE :oh:

26/12/2007 @ 12:51:46: ovh: [CSS/HTML] Une combobox d'images?

Si la norme n'est pas respectée, ça ne sert à rien de dire qu'on peut le faire puisqu'en pratique ça ne marche nulle part :spamafote:

26/12/2007 @ 13:00:39: max: [CSS/HTML] Une combobox d'images?

Une solution alternative:

le nom de l'image (ou un id) dans l'attribut 'value' et un onchange sur le 'select' pour afficher l'image dans une zone à côté.

Sinon, je crois que le tag img dans un option fonctionne mais que dans firefox je crois (je pense l'avoir déjà avec des petits drapeaux et des noms de pays)

26/12/2007 @ 13:02:45: zion: [CSS/HTML] Une combobox d'images?

ovh> Si, sous Firefox ça fonctionne :spamafote:

max> C'est la solution vers laquelle je m'oriente, mais cela réduit quand même pas mal la possibilité de choix de l'utilisateur, c'est moins intuitif ... Soit... :sweat:

26/12/2007 @ 13:06:30: kortenberg: [CSS/HTML] Une combobox d'images?

avec ff ça marche pour les options mais pas pour le select. Avec safari, ça marche avec le select mais pas avec les options. IE et opera marche pas du tout.

C'est triste.

16/05/2008 @ 12:38:58: arachne: [CSS/HTML] Une combobox d'images?

Si cela ne marche pas...
Tu pourrais définir un div pour le résultat sélectionné...avec un bouton ou une image pour aficher une liste...qui s'afficherai juste en dessous avec ta liste...
Un div pour la liste contenant des images et un texte (par example) et avec un id...unique s'entend...Dans le onclick...une fonction pour la sélection tu envoies l'id...dans le Mouseover..changement du background-color via une class css (désolé, pour les puriste du nomage et des norme W3C) et dans le onblur..idem pour la couleur...
dans le div principal n'oublie de jouer avec le overflow (css)... et un champs caché type hidden... pour la valeur finale à utilisé....

Cela peut sembler compliqué...mais je pense qu tu prendra ton pied avec cela...