JSFiddle - React, Tailwind, and code Playground

HTML

<div id="copyright">
    

</div>

CSS

#copyright{
	width: 100%;
	background-color: black;
	height: 50px;
	position: absolute;
	bottom:0;
}

JavaScript

$("#copyright").on("mouseenter",function(){
    $(this).animate({
        height:200 //Τελικό ύψος footer
    },500,function(){
        console.log("mouseenter finished");
    });
}).on("mouseleave",function(){
 $(this).stop(true).animate({
        height:50 //Αρχικό ύψος footer
    },500,function(){
        console.log("mouseleave finished");
    });
});