JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu">
    <button id="snapshot">Snapshoty</button>
</div>
<div id="snapshots">Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>Snap Shot
    <br/>
</div>

CSS

#snapshots {
    border:1px solid red;
    position:absolute;
    top:-260px;
    left:150px;
    height:250px;
}

JavaScript

var x = 0;

$('#snapshot').on('click', function () {
    if (x == 0) {
        x = 1;
    } else x = 0;

    if (x == 1) {
        $('#snapshots').animate({
            top: '10px'
        }, 2000);
    } else {
        $('#snapshots').animate({
            top: '-260px'
        }, 2000);
    }


});