Jquery 我的动画卷轴落后了，为什么

当滚动达到150px时，我试图隐藏菜单

HTML:

JS:

演示：

它似乎工作，但当我回到顶部，有时动画显示菜单开始有点太晚，反之亦然

---

什么原因导致此问题？

您需要在每次动画调用之前调用

.stop（）

，以确保在启动此动画之前不会等待完成最后一个动画

看

代码是：

$(function(){
    $(window).bind('scroll', function(){
        if($(this).scrollTop() >= 150) {
            $('#header').data('open','open');
        }
        if($(this).scrollTop() >= 150 && $('#header').data('open') == 'open'){
            $("#header").stop().animate({top:'-180px'},500, 'linear').data('open','open');
        }else{
            $("#header").stop().animate({top:'0'},500, 'linear').data('open', null);
        }
    });
});​

#header{height:200px; background:#000; position:fixed; top:0; width:100%;}

$(function(){
    $(window).bind('scroll', function(){
        if($(this).scrollTop() >= 150) {
            $('#header').attr('data-open','open');
        }
        if($(this).scrollTop() >= 150 && $('#header').attr('data-open') == 'open'){
            $("#header").animate({top:'-180px'},500, 'linear').attr('data-open','open');
        }else{
            $("#header").animate({top:'0'},500, 'linear').removeAttr('data-open');
        }
    });
});

$(function(){
    $(window).bind('scroll', function(){
        if($(this).scrollTop() >= 150) {
            $('#header').data('open','open');
        }
        if($(this).scrollTop() >= 150 && $('#header').data('open') == 'open'){
            $("#header").stop().animate({top:'-180px'},500, 'linear').data('open','open');
        }else{
            $("#header").stop().animate({top:'0'},500, 'linear').data('open', null);
        }
    });
});​