JSFiddle - React, Tailwind, and code Playground

by crucify

HTML

<script src="https://raw.github.com/brandonaaron/jquery-mousewheel/master/jquery.mousewheel.js"></script>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div class="scroll">
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
    alskdjflkasjdf<br />
    98asdokadv<br />
</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />

CSS

.scroll { width:200px; height:100px; overflow:scroll; }

JavaScript

$(function() {
    $('div.scroll').on('mousewheel', function(event, delta) {
        if(delta < 0) {
            if(this.scrollHeight - this.scrollTop - $(this).height() < 1) return false;
        } else {
            if(this.scrollTop < 1) return false;
        }
    });
});