JSFiddle - React, Tailwind, and code Playground

by Sebastian Kay

HTML

<div id="info"></div>
<div class="parent">
    <div class="child">0</div>
    <div class="child">1</div>
    <div class="child">2</div>
    <div class="child">3</div>
    <div class="child">4</div>
    <div class="child">5</div>
    <div class="child">6</div>
    <div class="child">7</div>
</div>

CSS

#info {
	position: fixed;
}
.parent {
    width: 250px;
    overflow: hidden;
    border: 1px solid blue;
    
}

.child {
        width: 100%;
        height: 250px;
        background-color: red;
        border: 1px solid blue;
    }

JavaScript

$(document).scroll(function() {

        var topoffset = $(document).scrollTop();
				$("#info").text(topoffset);
				});