JSFiddle - React, Tailwind, and code Playground

by thezillion

HTML

<html>
<head>
    <script>
        function $(el){
        return document.getElementById(el);
        }
        function smooth(what, from, to, time, units){
        var speed = (to - from) / time;
        var nowtime = 0;
        while (nowtime < time){
        from += speed;
        setTimeout(what + " = '" + from + "'", nowtime++);
        }
        }
        
        window.onload = function(){
        $('blackbox').onclick = function(){
        smooth("$('blackbox').style.top", 0, 100, 10000, 'px');
        }
        }
    </script>
</head>
<body>
    <div style='position: absolute; top: 2px; left: 0px; background: black;height: 100px; width: 100px;' id='blackbox'></div>
</body>
</html>