Struggling with adding an overlay to an expanding navigation bar, similar to Youtube's overlay when the slide-out nav is open. Need help with the implementation.
Here is the javascript code for the expanding navigation using jQuery:
'use strict';
// Open offsite navigation.
$('#nav-expander').on('click', function(e) {
e.preventDefault();
$('nav').toggleClass('nav-expanded');
});
// Close offsite navigation.
$('.menu .close').on('click', function(e) {
e.preventDefault();
$('nav').toggleClass('nav-expanded');
});
// Close offsite navigation after user clicks on a link in the navigation.
$('.menu a').on('click', function(e) {
//e.preventDefault();
$('nav').removeClass('nav-expanded');
});
...
This is the HTML code for the expanding navbar.