JSFiddle - React, Tailwind, and code Playground

HTML

<div id="TwitterBox"></div>

CSS

#TwitterWrap{
    background-color: #999;
    height: 500px;
    width: 300px;
    overflow: hidden;
    position: absolute;
    right: 25px;
    bottom: 25px;
}
#TwitterBox{
    background-color: #0FC;
    height: 400px;
    width: 300px;
    position: relative;
    top: 300px;
}

JavaScript

$('#TwitterBox').mouseenter(function(event) {
    $(this).animate({
        top: 0
    }, {
        duration: 'slow',
        easing: 'easeOutBack'
    }).mouseleave(function(event) {
        $(this).animate({
            top: 300
        }, {
            duration: 'slow',
            easing: 'easeOutBack'
        });
    });
});