JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container" style="overflow-x:scroll; max-width:1000px;">
  <div id="contained" style="width:3000px;">r</div>
</div>
<div id="log">0%</div>

CSS

#container {
    border: 1px solid black;
}

JavaScript

$('#container').scroll(function(){
    var scrollPercentage = 100 * this.scrollLeft / (this.scrollWidth-this.clientWidth);
    $('#log').html(scrollPercentage.toFixed(2)+'%');
});