JSFiddle - React, Tailwind, and code Playground

by tjdragon

HTML

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><div id="hello">
    
    text goes here
</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/>
f<br/><br/><br/><br/><br/><br/><br/><br/>

CSS

#hello{
background-color: red;
}

JavaScript

$(document).scroll(function() {
            var scrollFromTop = $(this).scrollTop();
            $("#hello").css("opacity", 1.5 -(scrollFromTop/250));
        });