JSFiddle - React, Tailwind, and code Playground

by catfood

HTML

<div id="box"></div>

CSS

#box{
    background:red;
    width:100px;
    height:100px;
    position:relative;
}

JavaScript

window.requestAnimationFrame = window.requestAnimationFrame ||
  window.mozRequestAnimationFrame ||
  window.webkitRequestAnimationFrame ||
  window.msRequestAnimationFrame;

var box = document.getElementById("box");

var animationStartTime = window.mozAnimationStartTime || (new Date).getTime ();
    
function step(timestamp) {
  var progress = timestamp - animationStartTime; 
  box.style.left = Math.min (progress/5, 800) + "px";
  if (progress < 2000) {
    requestAnimationFrame(step);
  }
}
requestAnimationFrame(step);