My Own JQuery Аккордеон

Question

Эй, ребята, я создал следующую структуру меню:

<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> 

Так что это моя структура меню. Теперь я хочу использовать jQuery Latest для создания эффекта SlideUp/SlideDown.

Я делаю это так:

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

Я первый попытался MouseOver и MouseOut, но когда я использовал эту функцию, то Mouseover работал, и когда я хотел пойти к югу, меню скользили, но MouseOut Событие occours. Теперь это сработало, но когда я зависаю, например. на главном элементе 3, Субботы также из основного пункта 4 открываются и закрываются на выводе?!?! Как сказать только пункты меню, например. Основной элемент 3 или основной элемент 4 ???

Надеюсь, вы понимаете, что я имею в виду?

Благодаря

Answer 1

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