JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content">sfsdfasfasfd</div>

CSS

#content {
 height: 4000px;   
}

JavaScript

$(function(){
    var Scroll = setInterval(function(){
         // gets the current position of the scrollbar;
        var current = $("body").scrollTop();
        // gets the maximum height of the page
        var maxHeight = $("body").height();
        
        // animates the scrollbar to the position 
        // scrollBy: 500px at a time
        // animateTheScrollBy: 300ms;
        current += 500;
        $("body").animate({scrollTop: current },300);
        console.log(current); 
    
        //stops the scrolling if it reaches the maxHeight
        if(current == maxHeight ){
            clearInterval(Scroll);
        }           
    },1000); // delay the scroll for 1000ms 
});