JSFiddle - React, Tailwind, and code Playground

HTML

<!--
* body для растягивание страницы с примером, чтобы появился скролл
-->

<div class="body">
    <div id="top">
        Вверх!
    </div>
</div>
<div id="footer">
</div>

CSS

div.body { width: 100%; height: 1000px; background: #f8f8f8; position: relative; }
div#top { width: 200px; position: fixed; left: 10px; bottom: 10px; background: #777; }
div#footer { width: 100%; height: 200px; background: #eee; }

JavaScript

function checkOffset() {
    if($('#top').offset().top + $('#top').height() >= $('#footer').offset().top)
    {
        $('#top').css('position', 'absolute');
    }
    
    if($(document).scrollTop() + window.innerHeight < $('#footer').offset().top)
    {
        $('#top').css('position', 'fixed');
    }
}
$(document).scroll(function() {
    checkOffset();
});