JSFiddle - React, Tailwind, and code Playground
HTML
<div id="test"></div>
CSS
body, html {
height:1000px;
position:relative;
margin:0;
padding:0;
}
#test {
height:300px;
background-color:blue
width:100px;
}
.fixed {
position:fixed;
bottom:0;
z-index:2;
}
JavaScript
$(window).scroll(function () {
if ($(this).scrollTop() > $('#test').height()) {
$('#test').addClass('fixed');
} else {
$('#test').removeClass('fixed');
}
});