Menu accordéon sur 2 niveaux

Bonjour à tous,

J'essaie de créer un menu accordéon qui se déplie au survol et qui referme les menus dépliés au survol d'une autre.

Ça marche parfaitement sauf que je souhaite que cet effet ne s'applique que sur un niveau.

En clair, je voudrai qu'au survol du niveau 1 le niveau 2 qui est à l'intérieur soit déjà ouvert.

le html
<ul class="tree">

  <li><a>Niveau 1</a>
     <ul>
       <li><a>item niveau 1</a></li>
       <li><a>item niveau 1</a></li>
     </ul>
  
  </li>

  <li><a>Niveau 1</a>
     <ul>
       <li><a>item niveau 1</a></li>
       <li><a>item niveau 1</a></li>
       <li><a>Niveau 2</a>
          <ul>
          <li><a> item niveau 2</a></li>
          </ul>
       </li>
     </ul>
  </li>

</ul> <!-- tree--> 


le script
$(document).ready(function(){
$(".tree > li a").next("ul").hide();
$(".tree > li a").mouseover(function(){
  if($(this).next("ul").is(":hidden")){
   $(".tree > li a").next("ul:visible").slideUp();
   $(this).next("ul").slideDown();
  }
});
})


Merci d'avance pour votre aide

1 réponse

  1. Je suis pas un pro de jquery mais il faut me semble t'il ciblé pour précisément tes UL du premier niveau.
    0