JSFiddle - React, Tailwind, and code Playground

by igalst

HTML

<span id="elem">foo</span>

CSS

#elem {
    position: absolute;
    top: 200px;
    left: 200px;
}

JavaScript

var r = 100;
var alphaStep = 1;
var waitIterationTime = 50;

var alpha = 0;

var elem = document.getElementById("elem");
var center = {
    x: 200,
    y: 200
};

console.log(center)

setInterval(function () {
    alpha += alphaStep;
    alpha = alpha > 360 ? 0 : alpha;

    var x = r * Math.cos(alpha * Math.PI / 180);
    var y = r * Math.sin(alpha * Math.PI / 180);
        
    elem.style.top = center.x + x + "px";
    elem.style.left = center.y + y + "px";
    
}, waitIterationTime);