JSFiddle - React, Tailwind, and code Playground

by lucasprus

HTML

<div id="container" style="height:400px;width:110px;border:1px solid black;overflow:hidden;" >
<div id="box" style="background:#98bf21;height:100px;width:100px;margin:6px;position:relative;">
</div>

</div>
<button id="btn1">Animate</button>
<button id="btn2">Reset</button>

JavaScript

$(document).ready(function()
  {
  $("#btn1").click(function(){
    $("#box").animate({top:"+=50px"});
  });
  $("#btn2").click(function(){
    $("#box").animate({top:"-=50px"});
  });
});