inserer des images a l'interieur d'un select/option

**mystro7200** · 02/06/2009, 10h50

Bonjour,

j'essaie de créer une liste deroulante dans une select/option (combo)
mais je veux qu'au début de chaque ligne j'insère une image comme icone :

menu1

menu2

menu3

mais j'arrive pas , j'avais esseier de le faire avec du CSS mais apperement ca doit se faire en javascript , j'ai commencé a y faire avec , mais toujours le probleme recurent, ca marche sous firefox et pas sous internet explorer , si vous avez de quoi m'aider j'en ai besoin , et merci pour votre aide

coici le fonction javascript

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 
<script type="text/javascript" >
 
function change() {
 
select = document.getElementById("aaaaaa");
select_s = select.style;
 
switch(select.selectedIndex) {
 
case 0 :
select_s.background = "url('google.png') no-repeat+&nbsp;";
break;
 
case 1 :
select_s.background = "url('ged.png') no-repeat6&nbsp;";
break;
 
case 2 :
select_s.background = "url('gez.png') no-repeat+&nbsp;";
break;
 
case 3 :
select_s.background = "url('ges.png') no-repeat+&nbsp;";
break;
 
default:
select_s.background = "none";
break;
}
}
 
</script>

et ma page html de test

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<body>
 
<select id="aaaaaa" style="background:url('google.png') no-repeat; " onload="change();">
<option style="background:url('google.png') no-repeat; ">  &nbsp;&nbsp;&nbsp; &nbsp;aaaaa</option>
<option style="background:url('ged.png') no-repeat;">  &nbsp;&nbsp;&nbsp; &nbsp;ssssss</option>
<option style="background:url('gez.png') no-repeat;">  &nbsp;&nbsp;&nbsp; &nbsp;dddddddd</option>
<option style="background:url('ges.png') no-repeat;">  &nbsp;&nbsp;&nbsp; &nbsp;dddddd</option>
</select>
 
 
</body>

**nod__** · 02/06/2009, 11h02

Tu ne peux pas en faire grand chose d'un <select> avec IE, la plupart des styles ne passent pas…

Soit tu te contentes du «pas d'images dans ie» soit tu optes pour un script qui émule un <select> en javascript.

**mystro7200** · 02/06/2009, 11h19

Envoyé par nod__

Tu ne peux pas en faire grand chose d'un <select> avec IE, la plupart des styles ne passent pas…

Soit tu te contentes du «pas d'images dans ie» soit tu optes pour un script qui émule un <select> en javascript.

ben oué , c'est ça ce je voudrais faire,utilisé du javascript mais je suis a court d'idée , si t'a une solution , je suis preneur

**nod__** · 02/06/2009, 11h32

YUI c'est une bonne lib : http://developer.yahoo.com/yui/examp...nu-select.html

**mystro7200** · 02/06/2009, 12h04

Envoyé par nod__

YUI c'est une bonne lib : http://developer.yahoo.com/yui/examp...nu-select.html

merci nod__ , mais ca ne m'aide pas trop, cette appi ne m'aiderais pas dans ce que je cherche

**nod__** · 02/06/2009, 12h25

bah à partir de l'exemple avec YUI tu fait un select perso. en bon vieux html crado, de cette façon il est possible d'intégrer des images dans la liste de choix. C'est bien ça le but final ?

Ou alors faut aller voir du coté de jQuery ou d'autres, mais le faire à la main, avec les problèmes de positionnement et la gestion des évènements comme pour un select, c'est laborieux.