JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu"></div>
<section id="filler"></section>

CSS

body{margin:0;padding:0;}

#menu {
    width: 100%;
    height: 200px;
    background: #000;
    position:fixed;
    top:0;
    left:0;
}

#filler{ width:100%; height: 1000px; background-color:#ccc;}

JavaScript

$(window).scroll(function(){
    if($(this).scrollTop() > 200){
        $("#menu").animate({
            height: "100px"   
        });
    }
});