JSFiddle - React, Tailwind, and code Playground
HTML
<button>Start Animation</button>
<div style="background:#98bf21;height:100px;width:100px;position:absolute; opacity:0;">
</div>
JavaScript
$(document).ready(function(){
$("button").click(function(){
onehalf();
otherhalf();
});
function onehalf(){
$("div").animate({
left:'50%',
opacity:'1',
});
}
function otherhalf(){
$("div").animate({
left:'100%',
opacity:'0',
});
}
});