JSFiddle - React, Tailwind, and code Playground

HTML

<div><div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni doloribus facilis dolorem harum. Atque quo officia numquam maiores eveniet totam esse praesentium sequi sit provident similique asperiores obcaecati rem. Necessitatibus.</div>
<div>Tempora laudantium totam dignissimos quidem vitae eveniet et at minima molestias similique ut saepe quam dolore sed aperiam! Hic maxime assumenda consequuntur non reiciendis quam corrupti suscipit blanditiis esse debitis.</div>
                <div class="scroller_anchor"></div>
<div id="box_content">Div da bloccare</div>
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas amet sint architecto quidem aspernatur illum esse! Error voluptas ipsam ab repellat fuga ea dignissimos repellendus labore ipsum delectus illum alias.</div>
    <div>Rem molestias sunt blanditiis dolore illo nihil at quasi nemo tenetur maiores excepturi beatae quam eius incidunt placeat dolores vero et pariatur cum tempore. At sed accusantium ducimus tempora cum!</div>
    <div>Numquam beatae fuga at perferendis omnis aspernatur magni atque delectus cumque voluptatibus totam debitis alias cupiditate corporis nemo illo ratione quo quae reiciendis quaerat harum ipsam consequuntur deleniti et repellat?</div>
    <div>Pariatur voluptatibus odit hic facere a ipsam laborum consequuntur voluptatem temporibus soluta dolores nostrum earum quod cum minus! Omnis dolorum ratione atque officia est repellat molestiae exercitationem aliquam voluptatem vitae?</div>
    <div>Debitis minima blanditiis aspernatur culpa nobis molestias magni porro minus iste reiciendis deleniti facere nam accusamus obcaecati distinctio veritatis ab tempora quia! Asperiores pariatur accusantium tenetur molestiae temporibus esse at.</div>
<div>Odit repellat quidem ea consequatur accusantium ratione eveniet aspernatur dolorum tempore consectetur sunt possimus adipisci enim eius veniam. Nostrum harum aliquid ipsam sed illum enim optio quia cumque nisi...

CSS

#box_content {
    border:1px solid red;
    display:block;
    position:relative;
    background-color:#fff;
    width:100%;
}

JavaScript

$(window).scroll(function(e) {    
    var scroller_anchor = $(".scroller_anchor").offset().top;
    if ($(this).scrollTop() >= scroller_anchor && $("#box_content").css("position") != 'fixed')     {     
        $("#box_content").css({            
            'position': 'fixed',
                        'top': '0px', // posizione che vuoi dargli
                    
        });
        // dimensione del tuo blocco che vuoi far diventare fixed
        $('.scroller_anchor').css('height', '20px');    
    }    
    else if ($(this).scrollTop() < scroller_anchor && $('#box_content').css('position') != 'relative')     {
        $('.scroller_anchor').css('height', '0px');        
        $('#box_content').css({
            'position': 'relative'
        });    
    }
});