JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://james.padolsey.com/demos/scrollevents/scroll-startstop.events.jquery.js"></script>
<div id="scrollbox">
    <div id="content"></div>
</div>
<div id="status"></div>

CSS

#scrollbox
{
    width:200px;
    height:200px;
    overflow:scroll;
}

#content
{
    width:5000px;
    height:400px;
}

JavaScript

var stopAutoScroll = false;

$(document).ready(function(){

setInterval(function(){
    if(!stopAutoScroll)
    {
       $('#status').html('scrolling');
       $('#scrollbox').scrollLeft($('#scrollbox').scrollLeft()+10);
    }else{
       $('#status').html('not scrolling');
    }
}, 310);

$('#scrollbox').bind('scrollstart', function(e){
    stopAutoScroll = true;
});

$('#scrollbox').bind('scrollstop', function(e){
    stopAutoScroll = false;
});

});