JSFiddle - React, Tailwind, and code Playground

HTML

<div class='expand'>
    <div class='float'>Menu here</div>
</div>

CSS

div.float {
    background-color: red;
    width: 300px;
}
div.expand { /* simply here to allow me to scroll*/
    height: 900px;
    padding: 30px;
}

JavaScript

$(window).scroll(function(e) {
    // 40 is the offsetTop of the menu. This should be constant as such
    // it's defined that way. To get your offsetTop you can use 
    // document.getElementById('id').offsetTop or $('selector').offset().top
    if ($(window).scrollTop() > 40) { 
        $('.float').css({
            position: 'fixed',
            top: '0'
        });
    } else {
        $('.float').css({
            position: 'static'
        });
    }
});