如何使用开始停止按钮按需启动自动滚动网页

Question

我正在尝试让我的脚本自动滚动我的网页，以便在启动和停止按钮上按需启动，请您帮忙吗

？

//run instantly and then goes after (setTimeout interval)
$("html, body").animate({
scrollTop: $(document).height()
}, 50000);
setTimeout(function() {
$('html, body').animate({
scrollTop: 0
}, 50000);
}, 50000);
setInterval(function() {
// 50000 - it will take 4 secound in total from the top of the page to the bottom
$("html, body").animate({
scrollTop: $(document).height()
}, 50000);
setTimeout(function() {
$('html, body').animate({
scrollTop: 0
}, 50000);
}, 50000);
}, 50000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

这段代码创建scrollJavaScript 变量(作为 setInterval(( 函数(并运行它。该函数将每 2 秒(2000 毫秒(滚动一次页面。您可以通过更改此值来调整自动滚动速度。单次向下滚动高度由 scrollBy(( 的第二个参数 – 1000 定义;窗口将以 1000 像素向下滚动。

function start_scroll_down() { 
scroll = setInterval(function(){ window.scrollBy(0, 1000); console.log('start');}, 1500);
}
function stop_scroll_down() {
clearInterval(scroll);
console.log('stop');
}

<button onclick="start_scroll_down();">Start Scroll</button>
<button onclick="stop_scroll_down();">Stop Scroll</button>