JSFiddle - React, Tailwind, and code Playground
HTML
<button>Button</button>
<div id="shelf"></div>
CSS
#shelf {
position:relative;
width:50px; height:50px;
background:#ff8800;
opacity:0;
-webkit-transition: all 0.75s ease-in-out;
-moz-transition: all 0.75s ease-in-out;
transition: all 0.75s ease-in-out;
}
#shelf.animate {
opacity:1;
top:100px;
left:100px;
}
JavaScript
$('button').click(function(){
$('#shelf').animate({opacity: 1}, {queue: false, duration: 'slow'});
$('#shelf').animate({ top: "-10px" }, 'slow');
// $('#shelf').addClass('animate');
});