jQuery ScrollTop加速

Question

我有一个用于scrollTop的jquery脚本，并尝试找出它启动后加速的原因。它开始慢，然后变得更快。

有没有办法在开始时停止延迟并使其在整个滚动中保持相同的速度？

// When DOM is fully loaded
jQuery(document).ready(function ($) {
    function scroll(speed) {
        $('.shooter-scroller').animate({ scrollTop: $('.shooter-scroller').prop('scrollHeight') }, speed, function() {
            $(this).animate({ scrollTop: 0 }, speed);
        });
    }
    speed = 80000;

    scroll(speed)
    setInterval(function(){scroll(speed)}, speed * 2);      
});

以下小提琴：

http://jsfiddle.net/andysimps1985/gn1a2kn7/10/

Answer 1

JQuery旨在以该形式进行滚动。 你可以试试：https://github.com/ArthurClemens/jquery-page-scroll-plugin也支持恒速滚动。

Answer 2

jQuery的animate有一个缓动属性，默认设置为swing。将缓动属性更改为linear将为您提供所需的恒定速度。

以下是使用缓动属性的代码示例。

// When DOM is fully loaded
jQuery(document).ready(function ($) {

    function scroll(speed) {
        $('.shooter-scroller').animate({
            scrollTop: $('.shooter-scroller').prop('scrollHeight'),
            easing: 'linear'
        }, {
            duration: speed,
            easing: 'linear', // <--- here
            complete: function () {
                $(this).animate({
                    scrollTop: 0
                }, {
                    duration: speed,
                    easing: 'linear', // <--- here
                    complete: speed
                });
            }
        });
    }

    speed = 8000;

    scroll(speed)
    setInterval(function () {
        scroll(speed)
    }, speed * 2);

});

JSFiddle