Bonjour à tous,
Je viens d'utiliser le tuto "Menu accordeon" il fonctionne à merveille.
Cependant j'aimerai pousser un peu plus loin le script en imbriquant des sous-sous menu dans mon menu comme ceci :
Avec le script proposé, les sous menus s'affiche bien, mais lorsque je désire cliquer sur "Item 2.1" tout se referme. J'aimerai que le menu parent reste déplié et que les sous items se déplient.
Le code javascript du tuto :
Si vous avez le temps de jeter un oeil je vous en serai reconnaissant ! Merci
Je viens d'utiliser le tuto "Menu accordeon" il fonctionne à merveille.
Cependant j'aimerai pousser un peu plus loin le script en imbriquant des sous-sous menu dans mon menu comme ceci :
<ul id="navigation">
<li class="toggleSubMenu"><span>Item 2</span>
<ul class="subMenu">
<li class="toogleSubMenu"><a href="" title="">Item 2.1</a>
<ul class="subMenu">
<li>Sous item 2.1.1</li>
<li>Sous item 2.1.2</li>
</ul>
<li>
</ul>
</li>
</ul>
Avec le script proposé, les sous menus s'affiche bien, mais lorsque je désire cliquer sur "Item 2.1" tout se referme. J'aimerai que le menu parent reste déplié et que les sous items se déplient.
Le code javascript du tuto :
<script type="text/javascript">
<!--
$(document).ready( function () {
// On cache les sous-menus
// sauf celui qui porte la classe "open_at_load" :
$("ul.subMenu:not('.open_at_load')").hide();
// On selectionne tous les items de liste portant la classe "toggleSubMenu"
// et on remplace l'element span qu'ils contiennent par un lien :
$("li.toggleSubMenu span").each( function () {
// On stocke le contenu du span :
var TexteSpan = $(this).text();
$(this).replaceWith('<a href="" title="Afficher le sous-menu">' + TexteSpan + '</a>') ;
} ) ;
// On modifie l'evenement "click" sur les liens dans les items de liste
// qui portent la classe "toggleSubMenu" :
$("li.toggleSubMenu > a").click( function () {
// Si le sous-menu etait deja ouvert, on le referme :
if ($(this).next("ul.subMenu:visible").length != 0) {
$(this).next("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open")
} );
}
// Si le sous-menu est cache, on ferme les autres et on l'affiche :
else {
$("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") } );
$(this).next("ul.subMenu").slideDown("normal", function () { $(this).parent().addClass("open") } );
}
// On empêche le navigateur de suivre le lien :
return false;
});
} ) ;
// -->
</script>
Si vous avez le temps de jeter un oeil je vous en serai reconnaissant ! Merci