jquery - 向下滚动后div滑入

Question

这是我的代码 http://jsfiddle.net/mihaene/7bdkB/

我想要一个 div 滑入，只要我向下滚动一定数量的像素。它可以工作，但是非常非常延迟（例如 5 秒）。有什么问题？

任何建议将不胜感激。

Answer 1

嗨，我认为问题是你的 else 块。然后 jQuery 开始播放动画，大约需要 300 毫秒。

var $test2 = $(".test2");
$(window).scroll(function () {
    if ($(this).scrollTop() > 100) {
        $test2.stop().animate({left: "200px"}, 300);
    } else {
        $test2.stop().animate({left: "-90px"}, 300);
    }
});

所以只需使用 jQuery 的 stop() 方法来停止这些动画。

旁注：也许您应该考虑不同的 if / else 语句，以免像其他建议的那样在每个滚动事件中都获得动画（或停止/重新启动）。

Answer 2

这是我能想到的最好的解决方案，如果我错了，请纠正我。

这些事件被堆叠起来，一个接一个地被触发。所以我的解决方案是将它们放在一个队列中，并在需要时清除队列。

我用队列

演示

希望这可以帮助

Answer 3

您的 jsfiddle 示例没有延迟问题，但这可能是因为窗口大小很小并且滚动触发的机会不多。延迟的可能原因是滚动功能触发的频率。它们会很快堆积起来并导致延误。

添加一个console.log（如果使用Firebug）并在控制台中查看频率以更好地了解频率。