Liste déroulante avec image

Question

Bonjour, je veux créer une liste déroulante en mettant des images correspondante aux noms de la listes déroulante. mon code de liste déroulante est : le but est de mettre à coté de chaque nom de l'entreprise son logo merci de votre aide?

Penicilline28 · Answer

Salut,

si tu souhaite rester en HTML, il me semble que ce n'est pas possible de l'intégrer directement dans la liste car les liste déroulante HTML ne le gère pas.

Par contre en jQuery ça doit être possible, tu peut aussi afficher une image, en fonction de ce que tu viens de sélectionner dans ta liste, à coté de la liste grâce au javascript.

LMBA · Answer

salut, 

oui je souhaite rester en html, en faite je dois récupérer les noms et les images dans une table. Toute façon si je réussis à afficher ça dans ma page, ça serait bien même en utilisant du javascript. 

Cdt

Penicilline28 · Answer

Alors en utilisant le Javascript tu pourras afficher une image grâce au "Onchange".

Je te mets un exemple que j'avais fait il y a quelques mois pour un site :

<HTML>

<SELECT onchange="selectChangestate(this)" name="state" >
<OPTION VALUE="undefined"><SELECTED>Choose</SELECTED></OPTION>
<OPTION VALUE="1 - Open">Open</OPTION>
<OPTION VALUE="2 - In progress">In Progress</OPTION>
<OPTION VALUE="3 - Waiting">Waiting</OPTION>
<OPTION VALUE="4 - Done">Done</OPTION>
</SELECT>

<img id="1 - Open" style="display:none;" src="/images/rouge.png"/>
<img id="2 - In progress" style="display:none;" src="/images/orange.png"/>
<img id="3 - Waiting" style="display:none;" src="/images/jaune.png"/>
<img id="4 - Done" style="display:none;" src="/images/vert.png"/>

</HTML>

<JAVASCRIPT>

function selectChangestate(selected){

var _val = selected.options[selected.selectedIndex].value;
var display = "none";
if ( _val == "1 - Open"){
display = "block";
}

document.getElementById("1 - Open").style.display = display;

var _val = selected.options[selected.selectedIndex].value;
var display = "none";
if ( _val == "2 - In progress"){
display = "block";
}

document.getElementById("2 - In progress").style.display = display;

var _val = selected.options[selected.selectedIndex].value;
var display = "none";
if ( _val == "3 - Waiting"){
display = "block";
}

document.getElementById("3 - Waiting").style.display = display;

var _val = selected.options[selected.selectedIndex].value;
var display = "none";
if ( _val == "4 - Done"){
display = "block";
}

document.getElementById("4 - Done").style.display = display;
}

</JAVACRIPT>

Prend exemple la dessus si tu veux, et si tu a des questions n'hésite surtout pas.

LMBA · Answer

salut, 

merci, je vais essayer pour l'instant je suis bloqué sur un popup;

Liste déroulante avec image

4 réponses

Votre réponse

Discussions similaires

Newsletters