Question

作为了解jQuery的更多信息的方法，我试图创建一个滚动到页面底部的函数，返回顶部，然后在无限循环中重新开始。

到目前为止，我已经有了这个

var scroll = $(document).scrollTop();

setInterval(function(){
        scroll += 5;
        $(document).scrollTop(scroll);
}, 10);

这将滚动到页面底部。

当它到达底部时，需要设置一个标志，可能是var direction = 1 其中1为向下，0为向上。
现在我需要添加像

这样的东西

if(direction){
    // scroll down
} else {
    // scroll up
}

所以我会不断检查direction的值，并将scroll var增加+ = 5或 - = 5

这听起来合乎逻辑还是有更简单的方法来实现这个目标？

修改

以下是somethinghere's建议的工作版本

https://jsfiddle.net/Panomosh/evkxou3e/

Answer 1

您应该使用jQuerys回调来创建无限递归函数。只需在animate函数中声明后添加一个函数，然后调用相同的函数，但反转传递的布尔值。

另外，animate会为你增加非常漂亮和顺利的效果！

function scrollTopOrBottom(top){
    if(top) $("body, html").animate({scrollTop: 0}, function(){
        scrollTopOrBottom(false);
    });
    else $("body, html").animate({scrollTop: $("document").height()}, function(){
        scrollTopOrBottom(true);
    });
}

scrollTopOrBottom(false);

更新：如上所述，这可能会产生* * ahem * * Stack Overflow，但此问题并不关心。如果您想要安全，请在每个stop()语句后使用$("body, html")来阻止呼叫在另一个正在进行时继续进行，从而推迟溢出。

注意：您也可以将if语句包装在{}中，但由于它是一个语句，我发现它更易读，更像句子，类似于代码。但那是偏好。

Answer 2

您可以将方向值设置为1向下滚动，或-1向上滚动。

然后在更改滚动值时，您可以执行以下操作：

scroll += 5 * direction;

在两个循环之间切换

2 个答案: