colorer l'option d'une balise select

autant pour moi j'avais bien fait le test avec l'id mais j'ai pas uploadé le bon fichier


mais il y a un shmilblick

http://nebilpro.free.fr/perso/menu.html

Citation:

---

Envoyé par nebil

mais il y a un shmilblick

http://nebilpro.free.fr/perso/menu.html

---

Lequel ?

et bien le background au depart est orange , mais dés que le deroule mon select avant meme d'avoir fait un choix celui ci devient bleue celui qui est en avant a toujours son orange et dans la liste celui ci et vert.


je me suis peut etre mal exprimé

je souhaite que le fond soit orange quand je deroule toute les options sont toujours orange et quand je fait mon choix celui ci devient bleue .
puis je rederoule j'ai mon choix qui est toujours bleu et le reste est orange je refait un nouveau choix une fois celui ci selectionner il devient bleue et tou le reste orange , en fait la background de l'option change de couleur de fond quand celui ci est choisi pour le reste rien ne change .

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

<script type="text/javascript"> var debut=false; function changeCouleur(){ if(debut){ var elt = document.getElementById('accident'); for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'green':'blue'; } } else{debut=true} } </script>

---

:arf: http://nebilpro.free.fr/perso/menu.html

Code:

---

'green':'blue';

---

bleu ou vert ???

si tu veux autre chose, par exemple orange ... faut peut être modifier non ???

ba il y a la couleur par defaut orange puis celle qui vient juste coloré le fond de l'option choisi

Désolé, j'avais mal compris ce que tu voulais... Mais sinon, ce que SpaceFrog t'explique, c'est que dans

Code:

---

1 2 3 4 5 6

function changeCouleur(){ var elt = document.getElementById('accident'); for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'green':'blue'; } }

---

tu définis les couleurs bleu ou vert, donc ça affiche bleu ou vert... si tu veux orange ou bleu :

Code:

---

1 2 3 4 5 6

function changeCouleur(){ var elt = document.getElementById('accident'); for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'blue':'orange'; } }

---

quel je comprenne pour resumer si c'est bien cela ca marche pas

Code:

---

1 2 3 4 5 6 7 8

<script type="text/javascript"> function changeCouleur(){ var elt = document.getElementById('accident'); for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'green':'blue'; } } </script>

---

Code:

---

1 2 3 4 5 6 7 8

<select name="kilometrage_debut" onclick="changeCouleur(this)"> <option value="0" selected="selected">De :</option> <option value="5000">5.000</option> <option value="10000" >10.000</option> <option value="15000">15.000</option> <option value="20000">20.000</option>   </select>

---

Code:

---

<select name="kilometrage_debut" onclick="changeCouleur(this)">

---

Code:

---

1 2 3 4 5 6 7

<script type="text/javascript"> function changeCouleur(elt){ for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'green':'blue'; } } </script>

---

Si tu veux l'option sélectionnée en vert et les autres en bleu... si tu veux bleu et orange :

Code:

---

elt.options[i].style.backgroundColor=elt.options[i].selected?'blue':'orange';

---

jvais faire faire autrement

la le fond est orange je deroule tout est orange

Code:

---

1 2 3 4 5 6 7

<select id="accident" onclick="changeCouleur(this)"> <option value="0" selected="selected">De :</option> <option value="5000">5.000</option> <option value="10000" >10.000</option> <option value="15000">15.000</option> <option value="20000">20.000</option> </select>

---

le fait le choix 10 000 je lache la souris mon choiw est comfirmer
le fond vue par l'internaute c'est 10 000 avec fond bleu


il rederoule le select sans changer l'option
donc il est toujours sur le 10 000 qui est bleu et il voit aussi dans la liste le 10000 qui est bleu aussi mais tout les autres son orange , il change l'option est choisi 20 000 il lache le select .
l'intenaute voit 20000 avec un fond bleu si il deroule tout les autre sont orange sauf le 20000 bien sur

Code:

---

1 2 3 4 5 6 7

<script type="text/javascript"> function changeCouleur(elt){ for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'blue':'orange'; } } </script>

---

c'est presque ca , sauf que la quand j'arrive sur la page mon select a un fond blanc au lieu du orange et quand je fait mon choix et que le lache le select
le select reste blanc au lieu de passer en bleu.

j'ajoute le style orange par default sa regle le probleme de couleur de fond par defaut il reste celle qui doit devenir bleu lorceque le choix est fait.

Code:

---

<select onclick="changeCouleur(this)" id="accident" style="background-color: orange;">

---

ok cela regle la couleur de fond par defaut ,


mais quand je fait mon choix sur 20.000 et que je lache le select
la couleur de fond reste orange au lieu de devenir bleu .



http://nebilpro.free.fr/menu.html

Code:

---

1 2 3 4 5 6 7 8

<script type="text/javascript"> function changeCouleur(elt){ for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'blue':'orange'; } elt.style.backgroundColor='blue'; } </script>

---

pile poil :D ,,
sa ete plus difficile pour moi d'expliquer ce que je voulais que pour toi d'ecrire les scripts .
bon aller pour abuser encore un peu de ton savoir tant que je t'est encore sous la main

le fond peut-il redevenir orange si je revient au choix initial du select cad au
selected="selected"

Code:

---

1 2 3 4 5 6 7 8

<select id="accident" onclick="changeCouleur(this)" style="background-color:orange;"> <option value="0" selected="selected">De :</option> <option value="5000">5.000</option> <option value="10000" >10.000</option> <option value="15000">15.000</option> <option value="20000">20.000</option>   </select>

---

Oui :

Code:

---

1 2 3 4 5 6 7 8

<script type="text/javascript"> function changeCouleur(elt){ for(var i=0;i<elt.options.length;i++){ elt.options[i].style.backgroundColor=elt.options[i].selected?'blue':'orange'; } elt.style.backgroundColor=elt.options[elt.selectedIndex]==elt.options[elt.defaultSelected]?'orange':'blue'; } </script>

---

la pour le coup le bleu arrive dés qu'on a clické sur le select alors meme qu'aucun choix n'a encore ete fait et de retour sur l'option par defaut le fond reste bleu


http://nebilpro.free.fr/menu.html

:oops:

Code:

---

elt.style.backgroundColor=elt.options[elt.selectedIndex].defaultSelected?'orange':'blue';

---