JSFiddle - React, Tailwind, and code Playground
by Dave Mednick
HTML
<ul id="mobile-side-menu">
<li>Home</li>
<li>Stuff</li>
<li>Stuff</li>
<li>Stuff</li>
<li>Stuff</li>
<li>Stuff</li>
</ul>
<button id="mobile-menu-move">Show Menu</button>
<button id="mobile-menu-back">Remove Menu</button>
CSS
#mobile-side-menu{position:relative;left:-250;display:block;}
JavaScript
$(function () {
var $menu = $('#mobile-side-menu');
var $slideButton = $('#mobile-menu-move');
var $backButton = $('#mobile-menu-back');
$slideButton.on('click', function () {
$menu.animate({
left: "0"
}, 400, function () {});
});
$backButton.on('click', function () {
$menu.animate({
left: "-250"
}, 400, function () {});
});
});