使用topscroll的animate创建无限循环

时间:2014-10-15 10:15:15

标签: jquery

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

$(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但没有任何效果。我发现的每个例子都不起作用。如何为此函数添加无限循环?

1 个答案:

答案 0 :(得分: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
    }
);

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