JSFiddle - React, Tailwind, and code Playground
HTML
<div id=container>
<div id=pic>3</div>
</div>
CSS
#container{
border: 1px SOLID #FF000;
display: box;
width: 40px;
height: 40px;
overflow: hidden;
}
#pic{
text-align: center;
width: 35px;
height: 35px;
position: relative;
top: 0px;
font-size: 24px;
background-color: #FF0000;
color: #AAA;
border-radius: 20px;
}
JavaScript
$(document).ready(function(){
setInterval(slidedown,2000);
});
function slidedown(){
$("#pic").animate({
top: '48px'
},500)
setTimeout(function(){
$("#pic").css({
top: '0px'
});
},1000);
}