JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="menu">
        <ul>
            <li>Home</li>
            <li>About Us</li>
            <li>Random</li>
        </ul>
    </div>
    <div class="toggle"></div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec ex vestibulum, bibendum nulla id, tempus ex. Pellentesque ac porttitor ante. Nulla facilisi. Praesent volutpat massa lacus, eget lacinia mauris bibendum quis. Sed lacus dui, laoreet eu varius et, molestie non ipsum. Interdum et malesuada fames ac ante ipsum primis in faucibus. Praesent non orci eget dolor pulvinar finibus id in lorem.

Vestibulum quis accumsan dui. Ut ut orci purus. Etiam in ligula vel ligula ultricies scelerisque. Aliquam mattis mi ornare, pretium lorem vitae, pulvinar diam. Quisque blandit felis quis ullamcorper porta. Ut ac convallis urna. Ut auctor quis lacus eget placerat. Quisque mi tortor, sodales id quam quis, finibus laoreet odio. Vestibulum semper massa vitae nunc volutpat, ut viverra dolor convallis. Cras congue velit non tellus dignissim tristique. Aliquam sodales, arcu ut commodo tincidunt, purus libero imperdiet risus, sit amet finibus felis tellus id leo. Ut eros ex, varius sed pellentesque a, gravida at nisi.</p>
</div>

CSS

.wrapper{
    height: 1000px;
    width: 400px;
    display: block;
}

.menu{
    position: fixed;
    width: 150px;
    height: 100%;
    background: #ccc;
    top: 0;
    left: 0;
    display: none;
}

.toggle{
    width: 50px;
    height: 50px;
    background: rgba(0,0,0,0.5);
    position: fixed;
    top: 20px;
    right: 20px;
}

p{
    color: #000;
    font-size: 12px;
}

JavaScript

var $menu_toggle = $('.toggle');
var $navigation = $('.menu');

$menu_toggle.on('click', function(){
    $(this).toggleClass('mobile_open');
    if ($(this).hasClass('mobile_open')) {
        $navigation.fadeIn().animate({width: '150px'},250);
    } else{
        $navigation.animate({width: '0' },250).fadeOut();
    }
});

$(window).on('swiperight', function(){
    $menu_toggle.addClass('mobile_open');
    $navigation.fadeIn().animate({width: '150px'},250);
});

$(window).on('swipeleft', function(){
    $menu_toggle.removeClass('mobile_open');
    $navigation.animate({width: '0' },250).fadeOut();
});