JSFiddle - React, Tailwind, and code Playground

by Asif Sharif Shahid

HTML

<div id="container">
    <span id="random">RANDOM</span>
</div>

CSS

span { 
    display: inline-block; 
    position: absolute;
}

JavaScript

function moveDiv() {
    var $span = $("#random");
    
    $span.fadeOut(1000, function() {
        var maxLeft = $(window).width() - $span.width();
        var maxTop = $(window).height() - $span.height();
        var leftPos = Math.floor(Math.random() * (maxLeft + 1))
        var topPos = Math.floor(Math.random() * (maxTop + 1))
     
        $span.css({ left: leftPos, top: topPos }).fadeIn(1000);
    });
};

moveDiv();
setInterval(moveDiv, 5000);