JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    <div class="abc"></div>
    <div class="abc"></div>
    <div class="abc"></div>
    <div class="abc"></div>
    <div class="abc"></div>
    <div class="abc"></div>
    <div class="abc"></div>
    <div class="abc"></div>
</div>

CSS

.abc{
    background:#e3e3e3;
    border:1px solid #aaa;
    margin:10px 0;
    height:150px;
}
.masked{
    opacity:0.3;
}

JavaScript

$(".box .abc").each(function(){
    var topPos = $(this).position().top;
    if(topPos>400){
        $(this).addClass("masked")
    }
});