jQuery scrolltop 在快速滚动时延迟答案

【问题标题】：jQuery scrolltop is delayed on scrolling fastjQuery scrolltop 在快速滚动时延迟
【发布时间】：2013-08-12 14:44:39
【问题描述】：

http://jsfiddle.net/dennym/wJc9V/1/

遇到延迟触发 else 状态的问题。如果您向下滚动并快速向上滚动，则最多需要 2 秒钟，直到较小的菜单栏再次消失。通常第二个菜单（粉红色）应该出现在 200 像素处，而大的菜单（绿色）会在顶部消失。当滚动回顶部时，它应该反转这个状态。

有什么想法吗？

这是 js sn-p:

$(document).ready(function() {
    jQuery(window).scroll(function() {
        if (jQuery(window).scrollTop() > 200) {
            jQuery('.onco-nav-small').css({"display":"block", "visibility":"visible"}).animate({marginTop:"0px"},500);
            jQuery('.onco-nav-large').css({"display":"none", "visibility":"hidden"});
        } else {
            jQuery(".onco-nav-small").animate({marginTop:"-50px"},10);
            jQuery('.onco-nav-large').css({"display":"block", "visibility":"visible"});
        }
    });
});

【问题讨论】：

如果您要使用动画，您还必须停止动画，或者使用油门防止一次启动 3000 个动画。我宁愿不为这种功能使用动画。

标签： jquery twitter-bootstrap jquery-animate scrolltop

【解决方案1】：

DEMO

Documentation

.stop( [clearQueue ] [, jumpToEnd ] )在else部分设置stop(true,true)，清除完整的上一个动画。这样下一个动画就没有延迟了。

jQuery(".onco-nav-small").stop(true,true).animate({marginTop:"-50px"},10);

【讨论】：