Javascript animate（）更新速度不够快

我正在制作一个位于页面顶部的导航栏。当用户向下滚动时，此栏将收缩，当用户返回页面顶部时，导航栏将返回其原始尺寸

问题：当用户向下滚动时，导航栏会按预期缩小。但是，如果用户快速滚动回页面顶部，导航栏将保持收缩状态，

scrollTop（）

回调函数中的

animate（）

函数将在几秒钟后触发

为了调试它，我包括了

console.log（$（window.scrollTop（））

告诉我用户在页面上的当前位置。我以用户滚动的速度获得

console.log

输出但是

{console.log（'animated'）；

应该在动画完成时触发，直到

console.log（$（window.scrollTop（））；

输出后几秒钟才会出现

如何让

animate（）

在用户向上滚动时快速响应

JS代码

var navBar = $('#navbar-inner');
var top = navBar.css('top');
$(window).scroll(function() {
    console.log($(window).scrollTop());
    if($(this).scrollTop() > 50) {
        navBar.animate({'marginTop':'-20', 'height':'60'}, 300);
    } else {
        navBar.animate({'marginTop':'0', 'height':'80'}, 300, function() 
            {console.log('animated');});
    }
});

---

我以前在使用比用户动作持续时间更长的动画时遇到过这种问题

navBar.stop(true, true).animate(...);

---

为了更好地理解stop（），这里有一个链接。希望它对我有所帮助。

我以前在使用比用户动作持续时间更长的动画时遇到过这种问题。你只需要停止动画，比如

navBar.stop(true, true).animate(...);

为了更好地理解stop（），这里有一个链接。希望它能有所帮助

使用

.stop（）

停止任何正在进行的动画，然后再开始新的动画。

（将我的评论作为答案发布）

---

使用

.stop（）

停止任何正在进行的动画，然后再开始新的动画。

我建议执行

navBar.stop（）.animate（…

在开始新的动画之前停止任何正在进行的动画。不确定这是否能解决您的问题，但值得一试。@MrOBrian:将其作为答案发布，以便我们投票支持您，OP可以接受……我建议您执行

导航栏.stop（）.animate（…

在开始新的动画之前停止任何正在进行的动画。不确定这是否能解决您的问题，但值得一试。@MrOBrian:将其作为答案发布，以便我们投票支持您，OP可以接受。。。。