2012-02-15 53 views

回答

1

您必須使用mouseover,因爲mouseenter在從子元素移至父元素時未觸發。另外,當您將鼠標懸停在子菜單上時,您必須使用.stop()動畫來防止其滑動。將鼠標從子菜單移動到父元素也是如此。

http://jsfiddle.net/pTyvc/25/

$(".menu_item").mouseover(function(){ 
    $(this).addClass("selected") 
     .children().stop().slideDown(500); 
}); 

$(".menu_item").mouseout(function(e){ 
    $(this).removeClass("selected") 
     .children(".sub_menu").slideUp(500); 
}); 

$(".sub_menu").mouseover(function() { 
    $(this).stop(); 
}); 
+0

非常感謝它的工作 – 2012-02-15 14:44:12

+0

@亞瑟:我發現它實際上開始表現怪異,如果你移動鼠標滑過子菜單時,它會滑下來。這似乎有點複雜。 – pimvdb 2012-02-15 14:44:27

+0

添加'.animate({height:'100px'});' '停止()'後,爲了div將繼續下滑到全高 – Hadas 2012-02-15 14:45:43