JSFiddle - React, Tailwind, and code Playground

HTML

blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />

<div id='buttondiv'>IRGENDWAS</div>

blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />blabla<br />

CSS

#buttondiv{
    position:relative;
    width:100px;
    height:50px;
    background:#DDD;
    border:1px #000 solid;
    padding:10px;
}

JavaScript

$(document).ready(function(){
    var offset = $('#buttondiv').offset();
    $(window).on('scroll', function(){
       scrollPosition = $(this).scrollTop();
       if (scrollPosition >= offset.top) {
          $('#buttondiv').css("position","fixed").css("top","0px");
       }else{
          $('#buttondiv').css("position","relative").css("top","");
       }
    });
});