JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div">
    <div id="inner"></div>
</div>

<input type="text" id="scroll" />

CSS

#div {
    border: 1px solid #ccc;
    height: 200px;
    overflow: auto;
    width: 200px; }

#inner {
    background: #36f;
    height: 500px;
    width: 20px;

JavaScript

var $div = $('#div'),
    $scroll = $('#scroll'),
    $inner = $('#inner'),
    innerHeight = $inner.outerHeight(),
    divHeight = $div.innerHeight();

$div.scroll(function() {
    var scrollBottom = innerHeight - divHeight - $div.scrollTop();
    
    console.log(innerHeight, divHeight, $div.scrollTop());
    
    $scroll.val(scrollBottom + ' px');
});