JSFiddle - React, Tailwind, and code Playground
by Aides
HTML
<div class="scrollable">
</div>
<div class="fixed">
</div>
CSS
html, body
{
overflow: hidden;
width: 100%;
height: 100%;
}
.scrollable
{
overflow-y: auto;
height: 80%;
width: 100%;
}
.fixed
{
height: 5px;
position: fixed;
left: 0px;
right: 0px;
background-color: red;
}
JavaScript
for(var i = 0; i < 500; i++)
{
$('.scrollable').append('<div id="'+i+'">Lorem ipsum</div>');
}
console.log($('.scrollable'))
window.setInterval(function()
{
var anchor =$('#200').closest('.scrollable')
$('.fixed').css('top', anchor.offset().top);
console.log(anchor.offset().top);
}, 10);