JSFiddle - React, Tailwind, and code Playground

HTML

<div class="scroll_fixed foo"></div>
<div>
    
Quis ipsum ullamcorper dolore vulputate commodo suscipit eum duis  delenit molestie nostrud qui velit molestie zzril at eum ut volutpat,  consequat feugait aliquip amet. Laoreet illum illum suscipit zzril  nonummy dolore, dolore accumsan. Et, augue at tincidunt wisi duis sed  amet feugiat nulla luptatum nisl ut facilisis. Et veniam velit feugait  accumsan magna veniam, nulla vulputate in vero erat duis ea, illum  consequat at, exerci, ullamcorper. Te, dignissim feugiat iusto enim  consequat velit enim enim ea autem nulla eum, accumsan. Tation nisl, eum  in vero blandit et dolore consequat veniam accumsan duis ut eros in  odio delenit. Luptatum hendrerit molestie, et ullamcorper, odio ex, nisl  odio odio iriure minim vel elit exerci dolore, feugait nostrud, dolore  dolor ut. 
Duis autem esse molestie euismod in commodo enim,  exerci qui quis dolore dignissim velit augue, esse et vel et sit iriure  te esse. Molestie autem ut consequat dignissim, facilisi eros quis, et  facilisis consectetuer laoreet aliquip. Suscipit tation dolor dignissim  ex nisl praesent et lobortis eu nulla laoreet zzril ea hendrerit in. 
Vel  nisl ut facilisis nulla veniam velit feugait accumsan magna veniam,  nulla vulputate in vero erat duis ea, illum consequat at, exerci,  ullamcorper duis, dignissim. Iusto iusto enim consequat velit enim enim  ea autem nulla eum, accumsan blandit nisl, eum in. Feugait blandit et  dolore consequat veniam accumsan duis ut eros in odio delenit ea  hendrerit molestie. 
    Ullamcorper iriure ut diam aliquam consequat  at lobortis adipiscing praesent, dolore augue. Feugait ad ex aliquam,  eros, eu consequat autem esse molestie euismod in commodo enim, exerci  qui quis dolore dignissim velit augue, esse et vel et sit. Nostrud te  esse ex autem ut consequat dignissim, facilisi eros quis, et facilisis  consectetuer laoreet aliquip eu tation dolor dignissim ex nisl. In et  lobortis eu nulla laoreet zzril ea hendrerit...

CSS

.scroll_fixed {
    position:absolute;
    top:210;  
}
.scroll_fixed.fixed {
    position:fixed;
    top:0;
} 


.foo { background-color: red; width: 150px; height:150px;}
body { height: 5000px; width: 5000px; }

JavaScript

var leftInit = $(".scroll_fixed").offset().left;
var top = $('.scroll_fixed').offset().top - parseFloat($('.scroll_fixed').css('margin-top').replace(/auto/, 0));


$(window).scroll(function(event) {
    var x = 0 - $(this).scrollLeft();
    var y = $(this).scrollTop();

    // whether that's below the form
    if (y >= top) {
        // if so, ad the fixed class
        $('.scroll_fixed').addClass('fixed');
    } else {
        // otherwise remove it
        $('.scroll_fixed').removeClass('fixed');
    }
    
    $(".scroll_fixed").offset({
        left: x + leftInit
    });
    
});