JSFiddle - React, Tailwind, and code Playground

by Sam Liew

HTML

============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>
============================<br>
test1<br>
test2<br>
test3<br>
test4<br>
test5<br>

JavaScript

$(function() {
    // every 1 seconds, check + update
    setInterval(appendContent, 800);
    setInterval(continueScrolling, 1000);
});

var b = $('body');

// if almost at bottom, append more content
function appendContent() {
    if($(window).scrollTop() + $(window).height() * 2 > $(document).height()) {
        b.html(b.html() + b.html()); // double content
    }    
}

// continue scrolling linearly
function continueScrolling() {
    y = $(window).scrollTop();
    $("html, body").stop().animate({
        scrollTop: y+1000
    }, {
        duration: 1000,
        easing: 'linear',
        queue: false
    });
}