JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content">
    <p>Some content scrollable with the mouse wheel.</p>
    <p>Some content scrollable with the mouse wheel.</p>
    <p>Some content scrollable with the mouse wheel.</p>
    <p>Some content scrollable with the mouse wheel.</p>
</div>

<div id="fixed">cannot scroll</div>

CSS

#content {
    width: 150px;
    height: 150px;
    overflow: auto;
    border: 2px solid #F00;
}

#fixed {
    width: 50px;
    height: 50px;
    position: fixed;
    top: 50px;
    left: 50px;
    background: #FF9;
    border: 2px solid #990;
}

JavaScript

$('#fixed').on('mousewheel DOMMouseScroll', function(event) {
    $('#content').scrollTop($('#content').scrollTop() - (event.originalEvent.wheelDelta || -event.originalEvent.detail*30));
});