JSFiddle - React, Tailwind, and code Playground

by Md. Atiquzzaman Soikat

HTML

<div id="mycanvas"></div>

CSS

#mycanvas{
  width: 200px;
  height: 200px;
  background: green;
}

JavaScript

var start = null;
var element = document.getElementById("mycanvas");
element.style.position = 'absolute';

function step(timestamp) {
  if (!start) start = timestamp;
  var progress = timestamp - start;
  element.style.left = Math.min(progress/10, 200) + "px";
  if (progress < 2000) {
    window.requestAnimationFrame(step);
  }
}

window.requestAnimationFrame(step);