jQuery .slideUp（）影響運行問題

Question

任何人都能告訴我為什么效果如此頻繁地徘徊。 我的意思是你徘徊3次而不等待效果完成，你可以等到效果運行3次。

   $(function() {
            $('#dropdown_nav li').find('.sub_nav').hide();
            $('#dropdown_nav li').hover(function() {

                $(this).find('.sub_nav').slideDown(300);
            }, function() {

                $(this).find('.sub_nav').delay(2000).slideUp(300);
            });
        });

這里可以測試： http ： //jsfiddle.net/QTGvJ/

Answer 1

使用.stop()將清除動畫隊列

現場演示

$('#dropdown_nav li').on('mouseenter mouseleave',function() {
      $('.sub_nav', this).stop().slideToggle();
});

隨着mouseleave的延遲：

$('#dropdown_nav li').on('mouseenter mouseleave',function( e ) {
    var delayTime = e.type=='mouseleave' ? 1000 : 0;
    $('.sub_nav', this).stop().delay( delayTime ).slideToggle();
});

帶延遲的現場演示2

了解更多信息： http ： //api.jquery.com/stop/