jQuery .slideUp()影响运行问题

时间:2013-02-04 18:13:56

标签: javascript jquery

任何人都可以告诉我为什么效果如此经常被徘徊。我的意思是你徘徊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/

1 个答案:

答案 0 :(得分:5)

使用.stop()将清除动画队列

LIVE DEMO

$('#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();
});

LIVE DEMO 2 WITH DELAY

了解详情:http://api.jquery.com/stop/