Question

我有一个下拉菜单，效果非常好，但我想让它在用户徘徊在开箱即用后保持下降500毫秒。

我尝试使用.delay(500)，但动画似乎卡住了，菜单也没有消失。

这是我的代码。

$(function(){
$("ul.dropdown li ul").hide(0);
$("ul.dropdown li").hover(function(){
    $(this).addClass("hover");
    $('ul:first',this).show(0);
}, function(){
    $(this).removeClass("hover");
    $('ul:first',this).delay(500).hide(0);
});
$("ul.dropdown li ul li:has(ul)").find("a:first").append("&raquo;");

}）;

Answer 1

您正在使用此延迟，因为它将是setTimeout。对于你正在做的事情，我建议只使用setTimeout。

顺便说一句，你在500毫秒后隐藏它，因为用户可能想要返回它，不是吗？如果是，则必须考虑，如果用户返回隐藏功能，则取消隐藏功能。为此，请记住使用

的setTimeout

var myTimeOut = setTimeout(function, 500); clearTimeout(myTimeOut);

我完全建议你：

$(function(){
var myTimeout = null;
$("ul.dropdown li ul").hide(0);
$("ul.dropdown li").hover(function(){
    if (myTimeout) clearTimeout(myTimeout);
    $(this).addClass("hover");
    $('ul:first',this).show(0);
}, function(){
     var _thisRef = $(this);
     _thisRef.removeClass("hover");
     myTimeout = setTimeout(function() {
        _thisRef.find("ul:first").hide();
    }, 500);
});

$("ul.dropdown li ul li:has(ul)").find("a:first").append("&raquo;");
});

jquery delay（）打破动画

1 个答案: