JSFiddle - React, Tailwind, and code Playground
by David Underwood
HTML
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<div id="scroll">
<div id="width" style="width: 4000px">Scroll right!</div>
</div>
CSS
#scroll{
width:200px;
height:100px;
background-color:red;
overflow:auto;
}
JavaScript
$('#scroll').mouseup(function() {
var containerWidth = $('#scroll').width();//important
var contentWidth = $('#width').width();
var scrolLeft = $('#scroll').scrollLeft();
console.log('containerWidth',containerWidth);
console.log('contentWidth',contentWidth);
console.log('scrolLeft',scrolLeft);
console.log('calc',scrolLeft + containerWidth);
if(scrolLeft + containerWidth == contentWidth){
console.log("right!");
}
});