JSFiddle - React, Tailwind, and code Playground

by Alex

HTML

<div id="blue-box"></div>
<div id="red-box"></div>

CSS

#blue-box {
 position:absolute;
    margin-left:50px;
    margin-top:50px;
    height:100px;
    width:100px;
    background-color:blue;
    
}

#red-box {
    position:absolute;
    margin-left:180px;
    margin-top:50px;
    height:100px;
    width:100px;
    background-color:red;
    
}

JavaScript

$(document).ready(function(){
    $("#blue-box").hover(function(){
        $('#red-box').stop().animate({'top': '200px'}, 1500);
    }, function(){
        $('#red-box').stop().animate({'top': '0px'}, 1500);
    });
});