JSFiddle - React, Tailwind, and code Playground

by Alarr

HTML

<span id='action'>Open/Close</span>
<div class='left_column'></div>

CSS

.left_column{position: fixed;width: 100px;height: 100px;left: -90px;background-color: #353535;}

JavaScript

$(document).ready(function (){
    $(document).on({
        click : function(e) {
            if(!$(e.target).is('#action') && $(e.target).closest('.left_column').length === 0) {
                $('.left_column').animate({left: "-90px"},300);
            }
        }
    });
    $('#action').click(function(event){
        if($('.left_column').css('left') == "0px"){
            $('.left_column').animate({left: "-90px"},300);
        }
        else{
            $('.left_column').animate({left: "0px"},300);
        }
    });
});