JSFiddle - React, Tailwind, and code Playground
HTML
<div class="stage">
<span class="obj" id="obj"></span>
</div>
CSS
.stage { width: 100px; background:#eee; height: 20px; position: relative; left: 50vw; }
.obj { width: 1px; display: block; height: 100px; background: #000; left: 0; position: relative; }
JavaScript
let fps = (1000/60)
let dx = 100
let tmp = 0
let sa = 0.1
let rad = 0
let obj = document.getElementById("obj")
function cal()
{
if(rad < 360 )
{
rad += 3
tmp = Math.sin(rad * (Math.PI / 180))
obj.style.left = (100 * tmp) +'px'
}
else
{
rad = 0
}
}
let int = setInterval(cal,fps)