Make web page to auto scroll down

Today I want to share with you how to make a web page to automatically scroll down. This is applicable in dealing with social networks pages, business directories (ex. yellow pages) and other auto-upload resources.

The code

Both setInterval() and scrollBy() are typical browser JS functions:

JavaScript

var scroll = setInterval(function(){ window.scrollBy(0,1000); }, 2000);

This code creates scroll JavaScript variable (assetInterval() function) and runs it. The function will scroll a page every 2 sec (2000 msec). You may adjust the auto scroll speed by changing this value. The single run down scroll height is defined by scrollBy()’s second parameter –1000; a window will be scrolled down on 1000 px.

Insertion

In order to insert it: hit F12 (Ctrl+Shift+I at Opera browser) at a browser tab to open WebDev Tools. Choose Console tab there. Then insert the code and hit Enter.

You might close WebDev Tools (F12) and browser’s JavaScript will still run this function.

Stop auto scrolling

To stop it without exiting page you might clear scroll variable by the following code:

JavaScript

clearInterval(scroll);

Otherwise, you might remove all in-browser console scripting by just reloading a web page –F5. Yet, you’ll be back to the top of the page.

Code for your web page

Also, you might insert this code in your custom web page to run on demand:

<script>

function start_scroll_down() {

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

}

 

function stop_scroll_down() {

   clearInterval(scroll);

   console.log('stop');

}

</script>

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

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

Be aware, though, that this code has created a global (application) JS variable called scroll.