JSFiddle - React, Tailwind, and code Playground

by ignaciocorreia

HTML

<div id="test" style="display: none;">menu here</div>
<div id="trigger">Click me</div>

CSS

#test{
    height: 100%;
position: fixed;
background: #000;
width: 230px;
top: 0;
}
#trigger{
position: fixed;
z-index: 9;
background: #fff;
}

JavaScript

$(document).ready(function () {
    $("#trigger").toggle(function () {
        $("#test").show("slide", {direction: "left"}, 1000);
                         },
        function () {
            $("#test").hide("slide", {direction: "left"}, 1000);
        })
    
})