Bonjour à tous, j'ai developpé un petit code qui permet de faire un menu horizontal avec des menus verticaux pour chaque clique sur le menu.
J'ai un petit souci que j'arrive pas a resoudre. En fait, je veut que lorsque je clique une deuxieme fois sur le menu vertical(sous Menu) affiché ce dernier soit caché.
Merci d'avance.
Code :
<HTML>
<HEAD>
<TITLE> Menu horizontal </TITLE>
<SCRIPT language='JavaScript'>
function selectionner(obj){
obj.style.backgroundColor="red";
}
function deselectionner(obj){
obj.style.backgroundColor="orange";
}
function afficherMenu(obj,parGauche,parHaut,indice){
var n=3;
content="<TABLE cellspacing=1 width=100px style='position:absolute;left:"+parGauche+";top:"+parHaut+"'>";
for(i=1;i<=n;i++)
content+='<TR><TD style="height:5px; text-align:center;background-color:orange;" >Sous-Menu'+indice+'-'+i+'</TD></TR>';
content+='<TABLE>';
document.getElementById("pendule2").innerHTML=content;
}
</SCRIPT>
</HEAD>
<BODY>
<DIV id="pendule1"></DIV>
<SCRIPT>
var n=6;
var gauche=10,haut=37;
var tmp="<TABLE cellspacing=1 width=600px><TR>";
for(i=1;i<=n;i++){
tmp+='<TD style="height:5px; text-align:center;background-color:orange;" onmouseover="selectionner(this)" onmouseout="deselectionner(this)" onclick="afficherMenu(this,'+gauche+','+haut+','+i+')">choix'+i+'</TD>';
gauche+=100;
}
tmp+="</TR></TABLE>";
document.getElementById("pendule1").innerHTML=tmp;
</SCRIPT>
<DIV id="pendule2"></DIV>
</BODY>
</HTML>