Javascript 滚动重新启动函数导致jQuery动画问题

当用户向下滚动时，导航条滑入，我有一个问题。我的代码是有效的——但是如果你一直滚动（上下滚动，或者很快地下滚动），条的移动速度会很慢，而不是应该的速度。我认为这是因为即使在动画进行到一半时，函数也会自动重新启动，因此它必须移动一半的距离，同时保持相同的时间，就好像它必须移动整个距离一样。我发现了几种可能性，但它们都清除了我无法执行的动画队列，就好像我在向下动画完成之前滚动到顶部一样，导航栏仍将可见，即使它不应该可见。因此，基本上我希望导航条能够平滑地滑入，即使我一直向下滚动，但是需要有某种东西阻止我在导航条仍然可见的情况下滚动到顶部。谢谢

JSFiddle：

我的代码：

jQuery(document).ready(function() {
    var offset = 220;
    var duration = 500;

    jQuery(window).scroll(function() {
        if (jQuery(this).scrollTop() > offset) {
            jQuery('#nav').stop(true).animate({'top': '0'}, duration, 'linear');
        } else {
            jQuery('#nav').stop(true).animate({'top': '-72px'}, duration, 'linear');
        }
    });
});

---

由于动画只需要运行一次，我创建了一个名为position的变量，该变量限制“向下动画”多次运行，直到调用“向上动画”，反之亦然。谢谢你的主意

jQuery(document).ready(function() {
    var offset = 220;
    var duration = 300;
    var position = 'up';

    jQuery(window).scroll(function() {
        if (jQuery(this).scrollTop() > offset && position === 'up') {
            jQuery('#nav').stop(true).animate({'top': '0'}, duration, 'linear');
            position = 'down';
        } else if (jQuery(this).scrollTop() < offset && position === 'down'){
            jQuery('#nav').stop(true).animate({'top': '-72px'}, duration, 'linear');
            position = 'up';
        } else {
            return;
        }
    });
});

jQuery（文档）.ready（函数（）{
var偏移=220；
var持续时间=300；
var位置='向上'；
jQuery（窗口）.滚动（函数（）{
if（jQuery（this）.scrollTop（）>偏移量和位置=='up'）{
jQuery（“#nav”）.stop（true）.animate（{'top'：'0'}，duration，'linear'）；
位置=‘向下’；
}else if（jQuery（this）.scrollTop（）

每当滚动到达动画点时，您需要设置一些标志，并且只做一次动画。@adeneo非常感谢我得到了它now@VotetoClose对我来说，这消除了平滑动画。谢谢你的帮助，但我现在已经修好了