JSFiddle - React, Tailwind, and code Playground

by hslincoln

HTML

<div id="ball"></div>

CSS

#ball {
    position:absolute;
    width:70px;
    height:70px;
    border:1px solid black;
    border-radius:70px 70px 70px 70px;
    top:0px;
    right:0px;
    background:#f0f0f0;
    
}

JavaScript

var left = $('#ball').offset().left;
var right = $('#ball').offset().right;

    
if ($('#ball').css('right') == "0px") {
    $("#ball").css({left:left}).animate({"left":"0px"}, "slow");
    console.log(
}      


function moveballback() {
    if ($('#ball').css('left') == "0px") {
    $("#ball").css({right:right}).animate({"right":"0px"}, "slow");
}
}