JSFiddle - React, Tailwind, and code Playground

by libinvbabu

HTML

<div id="friends">bob</div>
<div id="friends2">amy</div>

CSS

#friends,#friends2 { position:fixed }

JavaScript

var p = 0;

function moveit() {
    p += 0.05;

    var r = 100;
    var xcenter = 150;
    var ycenter = 150;

    
    var newLeft = Math.floor(xcenter + (r* Math.cos(p)));
    var newTop = Math.floor(ycenter + (r * Math.sin(p)));
    var newLeft1 = Math.floor(xcenter + -(r* Math.cos(p)));
    var newTop1 = Math.floor(ycenter + -(r * Math.sin(p)));
    
    $('#friends').animate({
            top: newTop,
            left: newLeft,
        }, 10, function() {
            moveit()
                });
    $('#friends2').animate({
        top: newTop1,
        left: newLeft1,
    },10, function() {
        moveit();
    });
 }
$(document).ready(function() {
    moveit();    
});