JSFiddle - React, Tailwind, and code Playground

by Neal

HTML

<body>
    <!--<button style="position:fixed; top: 50px; left:50px;" onclick="getheight()">CLICK ME</button>-->
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam vitae sapien nisi. Integer quis ligula diam. Etiam augue erat, interdum ac auctor at, cursus sit amet lacus. Sed elementum ullamcorper nisl eu vehicula. Duis id imperdiet sem. Cras aliquet, odio id mattis vulputate, velit nisl pellentesque lorem, in commodo libero magna eu turpis. In quis justo nunc. Nam nec eros et lorem elementum tincidunt eu ut ipsum. Proin viverra malesuada lectus pretium facilisis. Aenean magna dui, commodo eu tempus sit amet, dignissim vel mi. Nulla facilisi. In faucibus tincidunt elit at sodales. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut accumsan nisl enim. Ut consectetur condimentum blandit.
    
    Suspendisse potenti. Maecenas feugiat ligula vel lorem placerat ac placerat justo dignissim. Sed dapibus tortor quis erat sollicitudin porttitor. Quisque sed nisi lacus, tristique fermentum nunc. Nam sollicitudin sollicitudin felis eu rhoncus. In et luctus orci. Nunc consequat purus in odio faucibus eu faucibus eros tincidunt. Duis quis ullamcorper sapien. Aliquam sollicitudin nisi sit amet ante scelerisque in rhoncus leo adipiscing. Fusce aliquet scelerisque metus, vitae sodales libero tristique a. Phasellus rutrum ultricies consequat. Sed id pretium ligula. Nam vitae interdum eros. Ut ac euismod ante. Donec id congue sapien. Suspendisse justo leo, vulputate ac venenatis ornare, condimentum quis nisi.
    
    Fusce ultrices, lorem in ullamcorper blandit, neque elit sagittis diam, non sodales nibh arcu eu velit. Ut dolor ante, iaculis quis suscipit sed, tincidunt quis odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec ultricies convallis felis sit amet hendrerit. Donec ac neque risus, sed imperdiet magna. Phasellus nibh lorem, lobortis in dapibus in, dapibus a tellus....

JavaScript

function getheight() {
    var myWidth = 0,
        myHeight = 0;
    if (typeof(window.innerWidth) == 'number') {
        //Non-IE
        myWidth = window.innerWidth;
        myHeight = window.innerHeight;
    } else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
        //IE 6+ in 'standards compliant mode'
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
    } else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
    }
    var scrolledtonum = window.pageYOffset + myHeight + 2;
    var heightofbody = document.body.offsetHeight;
    if (scrolledtonum >= heightofbody) {
        window.scroll(0,0);
    }
}

window.onscroll = getheight;