My Own jQuery Accordéon

Question

Hé les gars, j'ai créé la structure du menu suivant:

<div id="menu">
<ul>
<li><a href="#">Main Item1</a></li>
<li><a href="#">Main Item2</a></li>
<li><a href="#">Main Item3</a>
    <ul>
    <li><a href="#">SubItem for MainItem3</a></li>
    <li><a href="#">2ndSub for MainItem3</a></li>
    </ul>
</li>
<li><a href="#">Main Item4</a>
    <ul>
    <li><a href="#">SubItem for MainItem4</a></li>
    <li><a href="#">2ndSub for MainItem4</a></li>
    </ul>
</li>
</ul>
</div>

Voilà ma structure de menu. Maintenant, je veux utiliser jQuery pour rendre le dernier slideUp / slideDown effet.

Je fais de cette façon:

$(document).ready(function(){
    $('#menu ul li:has(ul)').mouseenter(function(){         
                $('#menu ul li ul').slideDown('slow');                              
    }).mouseleave(function(){
        $('#menu ul li ul').slideUp('slow');
    });
});

J'ai d'abord essayé et mouseover mouseout, mais quand je l'ai utilisé cette fonction, le Mouseover travaillé et quand je voulais aller à la Sous, le menu coulissé, mais mouseout occours de l'événement. Maintenant, il a travaillé, mais quand je passe la souris par exemple sur Main Point 3, la Subs également de Main Point 4 ouvrir et fermer le mouseout?!?! Comment dire que les éléments du menu de par exemple Article principal 3 oder principal Point 4 ???

Je espère que vous comprenez ce que je veux dire?

Merci

Answer 1

$(function(){
    $('#menu ul li:has(ul)').hover(function(){                 
            $(this).find('ul').slideDown('slow');                                                          
    }, function(){
            $(this).find('ul').slideUp('slow');
    });
});