JSFiddle - React, Tailwind, and code Playground

by sarathsprakash

HTML

<div id="header" width='100px' height='200px'>gg</div>

CSS

body
{
    height:1000px;
}
.red
{
    background:red;
}
#header
{
    position:fixed;
}

JavaScript

var $document = jQuery(document),

$element = jQuery('#header'),

className = 'red';

$document.scroll(function() {

$element.toggleClass(className, $document.scrollTop() >= 400);

});