JSFiddle - React, Tailwind, and code Playground
by Sebastian Kay
HTML
<div id="kasten" style=""></div>
<button id="acton" type="button">ACTION</button>
CSS
body{
padding: 0;
margin: 0;
}
#kasten {
background:#98bf21;
height:140px;
width:100px;
position:absolute;
}
button {
margin-top: 200px;
}
JavaScript
$(document).ready(function(){
$("button").click(function(){
$("#kasten").animate({top: '-70px'}, 100, function() {
//callback
$("#kasten").animate({height: '70px'}, 10, function(){
$("#kasten").animate({top: '0px'}, 100);
});
});
});
});