Question

有几个人昨天在scrollTop函数上遇到了一个jQuery问题，但我现在还有一个小问题。下面是js的小提琴。我需要让js将内容反弹回顶部而不是向后滚动到顶部。

这是JS，在它下面小提琴。

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);

}）;

fiddle

我需要将速度保持为线性，但滚动一旦到达底部就会重置到顶部。任何帮助都会很棒！在此先感谢人们：）

Answer 1

这是一个更新的小提琴：http://jsfiddle.net/tsb5pj49/4/

您可以使用相同的功能将scrollTop设置为0，而不是将其设置为回到顶部。此外，如果将setInterval存储在变量中，则可以清除它并在动画完成并重置scrollTop时再次启动它。像这样：

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

    var speed = 8000,
        scrollInterval;


    function scroll(speed) {

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

    }

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

    function onScrollingComplete() {
        $( this ).scrollTop( 0 );
        clearInterval( scrollInterval );
        startScrolling();
    }

    startScrolling();

});

希望这有帮助

jQuery ScrollTop添加到此脚本

1 个答案: