JSFiddle - React, Tailwind, and code Playground

HTML

<div id="left-panel">
    <div style="height:5000px;"> CONTENT </div>

</div>

CSS

#left-panel { 

position: fixed;
    top: 0;
    left: 0;
    width: 80%;
    height: 100%;
    z-index: 2;
overflow:auto;

    height:2000px;
}

JavaScript

$(document).ready(function(){       
            var scroll_pos = 0;
            $("#left-panel").scroll(function() { 
                scroll_pos = $(this).scrollTop();
                if(scroll_pos > 210) {
                    $("#left-panel").css('background-color', '#1A1A1A');
                } else {
                    $("#left-panel").css('background-color', 'red');
                }
                console.log(scroll_pos);
            });
        });