JSFiddle - React, Tailwind, and code Playground

HTML

<div class="clickMe"></div>
<div id="outer">
    <div id="inner">
        <div class="slide"></div>
        <div class="slide"></div>
        <div class="slide"></div>
    </div>
</div>

CSS

* {
    margin: 0;
    padding: 0;
}
.clickMe {
    width:15px;
    height:20px;
    background-color:black;
    border-radius: 5px 5px 0px 0px;
    display:inline-block;
    cursor: pointer;
}
.slide {
    width:20px;
    height:20px;
    background-color:red;
    display:inline-block;
}
#inner {
    width: auto;
    left: 0px;
    position: relative;
}
#outer {
    width: 100px;
    overflow: hidden;
    display: inline-block;
}

JavaScript

state = true;
$('.clickMe').click(function () {
    if (state) {
        $("#inner").animate({
            left: '-100px'
        }, "slow");
        state = false;
    } else {
        $("#inner").animate({
            left: '0px'
        }, "slow");
        state = true;
    }

});