使用topscroll的animate创建无限循环

Question

我正在尝试循环一个函数/动画。我想要一个页面滚动到底部，然后跳到顶部并无限地执行。 我有代码只执行一次但是只有一次：

$(document).ready(pagescroll);
function pagescroll() {
    var z = document.getElementById('main_container').clientHeight + 2400;
    var speed = z * 2;
    window.scroll(0,0);
    $('body, html').animate({ scrollTop: z }, { easing: "linear", duration: speed });
}

main_container是一个跨页面的div。我尝试在pagescroll();之后添加animate，删除window.scroll(0,0)，并在pagescroll之后添加pagescroll()和duration:speed，将所有内容放入setTimeout但没有任何效果。我发现的每个例子都不起作用。如何为此函数添加无限循环？

Answer 1

您需要向animate函数添加回调，如下所示：

$('body,html').animate(
    {scrollTop: z},
    {easing: "linear", duration: speed}, 
    function() {
        $('body,html').scrollTop( 0 ); // scroll to top when animation finished
        pagescroll(); // call scroll function again
    }
);

在这种情况下，您的函数将以递归方式工作。