JSFiddle - React, Tailwind, and code Playground
HTML
<div style="height:2000px; float:left; width:100%;">
Text text
Text text
Text text
Text text
Text text
Text text
Text text
Text text
Text textv
Text text
Text text
Text text
Text textText text
</div>
JavaScript
//run instantly and then goes after (setTimeout interval)
$("html, body").animate({ scrollTop: $(document).height() }, 4000);
setTimeout(function() {
$('html, body').animate({scrollTop:0}, 4000);
},4000);
setInterval(function(){
// 4000 - it will take 4 secound in total from the top of the page to the bottom
$("html, body").animate({ scrollTop: $(document).height() }, 4000);
setTimeout(function() {
$('html, body').animate({scrollTop:0}, 4000);
},4000);
},8000);