Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
JS - mobile - open burger menu
//MOBILE MENU MANAGER - MOBILE //ON CLICK
var toggleMobileMenu = function(){
var $menuBtn = $('.js-mobile-menu-toggler');
var $menuContent = $('.js-mobile-menu-content');
var $body = $('body');
var $overlay = $('.overlay');
var viewPort = Nsw.viewPortWidth();
var menuWidth = viewPort - 80;
//Resize menu
$menuContent.css({
'width': menuWidth+'px',
'left' : '-'+menuWidth+'px'
});
var openMobileMenu = function(){
$menuContent.addClass('opened').css('left', 0);
$body.addClass('pushed').css('left', menuWidth+'px');
$overlay.addClass('opened');
}
var closeMobileMenu = function(){
$menuContent.removeClass('opened').css('left', '-'+menuWidth+'px');
$body.removeClass('pushed').css('left', 0);
$overlay.removeClass('opened');
}
$menuBtn.on('click', function(){
//OPEN
if ( !$menuContent.hasClass('opened') ){
openMobileMenu();
}
//CLOSE
else{
closeMobileMenu();
}
});
$overlay.on('click', function(){
closeMobileMenu();
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.