JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li>hai</li>
</ul>
JavaScript
var step = 1;
var current = 0;
var restartPosition = -5;
function scrollBg(){
//Go to next pixel row.
current -= step;
//If at the end of the image, then go to the top.
if (current == restartPosition){
step = -1;
} else if (current === 0) {
step = 1;
}
//Set the CSS of the header.
$("ul").append("<li>" + current + "</li>");
}
var init = setInterval(function(){scrollBg()}, 500);