let sidenav = $("#menuSidenav"); let hamburger = $("#hamburger"); let backButton = $("#back-button"); let openedSidenavClass = 'sidenav-open'; let activeBackgroundClass = 'active-background'; /* * Open navigation menu, change Hamburger icon to selected state * and display the back button overlay over the page */ function openNav() { sidenav.addClass(openedSidenavClass); backButton.addClass(activeBackgroundClass); enableHamburger(); } /* * Close navigation menu, change Hamburger icon back to default state * and hide the back button overlay */ function closeNav() { sidenav.removeClass(openedSidenavClass); backButton.removeClass(activeBackgroundClass); disableHamburger(); } /* * Toggle the navigation bar */ function toggleNav() { if (sidenav.hasClass(openedSidenavClass)) { closeNav(); } else { openNav(); } } function disableHamburger() { hamburger.removeClass("change-clic"); } function enableHamburger() { hamburger.addClass("change-clic"); } // Animate hamburger on hover hamburger.hover(function(){ hamburger.addClass("change-hover"); }, function(){ hamburger.removeClass("change-hover"); });