JSFiddle - React, Tailwind, and code Playground

by Alfie

HTML

<div id="footer">
    <ul>
        <li><a href="#"><img src="abc" /></a><a href="#">ABC</a>
        </li>
    </ul>
    <div id="kontaktdaten">
        <ul>
            <li>Adresse1</li>
        </ul>
    </div>
</div>

CSS

.open {
    background:red;
    
}
#footer{
    position:absolute;
    bottom:-57;
}

JavaScript

$('#footer').hover(function () {
    $(this).stop().animate({
        bottom: -25
    }, 500).addClass('open');
}, function () {
    $(this).stop().animate({
        bottom: -57
    }, 500).removeClass('open');
})