Bonjour à tous,
J'ai un petit souci avec mon menu. Quand je clique sur le menu 1 il m'affiche les sous menus1. là c'est ok.
Quand je clique sur le lien d'un sous menu, il affiche la nouvelle page mais il referme le sous menu.
J'aimerai que le sous menu 1 reste ouvert.
Je vais te donner un exemple.
Voilà mon menu lors de ma page d'accueil:
menu 1
menu 2
menu3
menu 4
Quand je clique sur menu 1 il m' affiche les sous menus du menu 1.
menu 1
sous menu1 page 1
sous menu1 page 2
sous menu1 page 3
menu 2
menu 3
menu 4
Ce que je voudrai avoir, c'est que quand je clique sur un des liens sous menu 1 il affiche la nouvelle page mais aussi que le menu 1 et les sous menu 1 son affiché.
menu 1
sous menu1 page 1
sous menu1 page 2
sous menu1 page 3
menu 2
menu 3
menu 4
Code Javascript :
<div style="width:190px;">
<script type="text/javascript" language="javascript">
function disply(d){
//fermer tous
switch(d)
{
case 'index' :
document.getElementById('mod_ges').style.display = "none";
document.getElementById('trans').style.display = "none";
document.getElementById('titi').style.display = "none";
document.getElementById('analyse').style.display = "none";
document.getElementById('quitter').style.display = "none";
break;
case 'mod_ges' : document.getElementById('index').style.display = "none";
document.getElementById('trans').style.display = "none";
document.getElementById('titi').style.display = "none";
document.getElementById('analyse').style.display = "none";
document.getElementById('quitter').style.display = "none";
break;
case 'trans' : document.getElementById('index').style.display = "none";
document.getElementById('mod_ges').style.display = "none";
document.getElementById('titi').style.display = "none";
document.getElementById('analyse').style.display = "none";
document.getElementById('quitter').style.display = "none";
break;
case 'titi' : document.getElementById('index').style.display = "none";
document.getElementById('mod_ges').style.display = "none";
document.getElementById('trans').style.display = "none";
document.getElementById('analyse').style.display = "none";
document.getElementById('quitter').style.display = "none";
break;
case 'analyse' : document.getElementById('index').style.display = "none";
document.getElementById('mod_ges').style.display = "none";
document.getElementById('trans').style.display = "none";
document.getElementById('titi').style.display = "none";
document.getElementById('quitter').style.display = "none";
break;
case 'quitter' : document.getElementById('index').style.display = "none";
document.getElementById('mod_ges').style.display = "none";
document.getElementById('trans').style.display = "none";
document.getElementById('titi').style.display = "none";
document.getElementById('analyse').style.display = "none";
break;
}
//*****************
var aff = document.getElementById(d);
//aff.style.display = "";
if(aff.style.display == ""){
aff.style.display = "none";
}
else{
aff.style.display = "";
}
}
</script>
<hr width="170" color="#FFFFFF" size="1" /><br />
<img src="./imgs/accueil.jpg" class="img_menu" onclick="disply('index');"/><br />
<div class="sous_menu" id="index" style="display:none;" onclick="disply('index');">
<img src="./imgs/arrow.gif" ><a href="index.php" class="mm3" >Acceuil</a><br />
</div>
<img src="./imgs/menu.jpg" class="img_menu" onclick="disply('mod_ges');"/><br />
<div class="sous_menu" id="mod_ges" style="display:none;" >
<img src="./imgs/arrow.gif" ><a href="formation.php" class="mm3" >Formation</a><br />
<img src="./imgs/arrow.gif"> <a href="niveau1.php">Niveau 1</a><br />
<img src="./imgs/arrow.gif"> <a href="niveau2.php">Niveau 2</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Examens</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Cours Théorique</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Perfectionnement</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Tarifs</a>
</div>
<img src="./imgs/biplace.jpg" class="img_menu" onclick="disply('trans');" /><br />
<div class="sous_menu" id="trans" style="display:none;" >
<img src="./imgs/arrow.gif"> <a href="#">Biplace</a><br />
</div>
<img src="./imgs/information.jpg" class="img_menu" onclick="disply('titi');" /><br />
<div class="sous_menu" id="titi" style="display:none;" >
<img src="./imgs/arrow.gif"> <a href="#">Matériel</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Occasions</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Renseignements</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Nous trouver</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Idée Cadeaux</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Météo</a><br />
<img src="./imgs/arrow.gif"> <a href="#">Contact</a><br />
</div>
<img src="./imgs/galerie.jpg" class="img_menu" onclick="disply('analyse');" /><br />
<div class="sous_menu" id="analyse" style="display:none;" >
<img src="./imgs/arrow.gif"> <a href="#">Galerie 1</a> <br />
</div>
<img src="./imgs/liens.jpg" class="img_menu" onclick="disply('quitter');" /><br />
<div class="sous_menu" id="quitter" style="display:none;" >
<img src="imgs/arrow.gif" > <a href="#">Liens Météo</a><br />
<img src="imgs/arrow.gif"> <a href="#">Liens Fabriquants</a><br />
<img src="imgs/arrow.gif"> <a href="#">Liens Clubs</a><br />
<img src="imgs/arrow.gif"> <a href="#">Liens Divers</a><br />
</div>
<br /><hr width="170" color="#FFFFFF" size="1" /><br />
<script type="text/javascript">disply(d);</script>
</div>Merci pour ton aide