JSFiddle - React, Tailwind, and code Playground

by Brodingo

HTML

<div id="footer">Hover meeeee<div id="content">LOL HEYYYOOOO</div></div>

CSS

#footer {
    position:fixed;
    bottom: 0;
    left:0;
    width:100%;
    height:50px;
    background: #333;
    color: #fff;
}

#content {
    margin-top: 50px;
    padding: 10px;
}

JavaScript

//sticky footer height

$('#footer').hover(function(){
    $(this).animate({height: 200},{queue:false});
},function(){
    $(this).animate({height: 50},{queue:false});
});