Question

我使用ul和li很明显地构建了一个简单的下拉三层。我已经在使用stop。（）。slideToggle（）进行悬停时打开了延迟，因此如果故意盘旋，它不会被错误打开。同样我已经延迟关闭它，所以如果用户误将菜单徘徊，则会留下一秒钟给予时间将其悬停回来。问题是，一旦徘徊，菜单开始闪烁，随意打开。

以下延迟显示和关闭的菜单代码：// Show then hide ddown menu on hover $('.ddown').hover(function(){ $( this ).children('ul').stop().delay(500).slideDown(500,'easeOutBounce'); }, function() { $( this ).children('ul').stop().delay(1000).slideUp(500,'easeOutBounce'); });

最初它是滑动切换，但现在改变它上下滑动，因为我虽然再次盘旋它被切换，它会调用菜单关闭，因为它仍然在延迟打开..但没有区别

任何帮助？

一如既往地再次感谢！

伊恩

Answer 1

虽然我没有测试过，但这可能有用

var menu_animation_timeout = null;
$('.ddown').hover(function(){
        clearTimeout(menu_animation_timeout);
        menu_animation_timeout = setTimeout(function(){
            $( this ).children('ul').stop().slideDown(500,'easeOutBounce');
        }, 500) 

    }, function() {
        clearTimeout(menu_animation_timeout);   
        menu_animation_timeout = setTimeout(function(){
            $( this ).children('ul').stop().slideUp(500,'easeOutBounce');
        }, 1000)
    });

从文档中看，似乎无法取消delay()，因此stop()只会使当前正在运行的动画出列，而不是延迟动画，这就是造成闪烁。

Answer 2

您的回答有所帮助，但没有为我的问题提供解决方案。可以在此处找到解决方案：UPDATED JS FIDDLE适用于遇到相同问题的任何人，以下是以下代码：

$(document).ready(function () {
//Show then hide ddown menu on hover
$('.ddown').hover(function () {
    $(this).children('ul').stop(true).delay(500).slideDown(500);
}, function () {
    $(this).children('ul').stop(true).delay(1000).slideUp(500);
});

}）;

鼠标退出后，Jquery下拉菜单会立即闪烁，并立即再次进入mouseenter

2 个答案: