如何推遲用jquery下拉菜單隱藏菜單？

我有一個可以正常工作的下拉菜單，但我希望如此，如果我將鼠標懸停在菜單上，它不會立即再次隱藏。所以基本上我想要一秒鐘的延遲。如何推遲用jquery下拉菜單隱藏菜單？

我已閱讀關於setTimeout，但不知道是否它是我需要？

$('#mainnav a').bind('mouseover', function() 
{ 
    $(this).parents('li').children('ul').show(); 
}); 

$('#mainnav a').bind('mouseout', function() 
{ 
    $(this).parents('li').children('ul').hide(); 
});

來源

2010-06-03 Keith Donegan

setTimeout正是你所需要的。

$('#mainnav a').bind('mouseout', function() 
{ 
    var menu = this; 
    setTimeout(function() 
    { 
     $(menu).parents('li').children('ul').hide(); 
    }, 1000); 
});

來源

2010-06-03 13:59:43

下次您顯示菜單時，請確保此計時器已關閉，以防止菜單突然打開/關閉 – baloo 2010-06-03 14:02:15

感謝您的回覆熊，當我嘗試它時，菜單現在停留並且不會消失。 – 2010-06-03 14:04:09

@Keith嘗試設置：var menu = this;在setTimeout（）之前，並在超時函數內將「this」更改爲「menu」 – baloo 2010-06-03 14:06:23

指定「slow」作爲顯示和隱藏的參數。來自JQuery Docs。

$('#mainnav a').bind('mouseover', function() 
{ 
    $(this).parents('li').children('ul').show("slow"); 
}); 

$('#mainnav a').bind('mouseout', function() 
{ 
    $(this).parents('li').children('ul').hide("slow"); 
});

來源

2010-06-03 13:59:21 mcandre

不完全。這緩慢地隱藏起來。隱藏之前，它根本不等待。 – 2010-06-03 14:00:51

對於鼠標移出我就躲（）調用之前添加一個鏈接的動畫：

$('#mainnav a').bind('mouseout', function() 
{ 
    $(this).parents('li').children('ul').animate({opacity:0.99}, 2000).hide(); 
});

這將使2秒的延遲。

來源

2010-06-03 14:00:27

如何推遲用jquery下拉菜單隱藏菜單？

回答

相關問題