JSFiddle - React, Tailwind, and code Playground

HTML

<div id="state-slider">
    My Slider
</div>

CSS

#state-slider {
    position: fixed;
    top: 50px;
    left: -270px;
    width: 300px;
    min-height: 100px;
    background-color: #ff9000;
}

JavaScript

$(function() {
    $("#state-slider").hover(function() {
        $(this).stop().animate({
            left: '0'
        }, 200);
    }, function() {
        $(this).stop().animate({ left: "-270" }, 500);
    });
});