const html = document.documentElement;
const menu = document.getElementById('header-menu-sidebar');
function openMenu(){
// add event listener to the html element
menu.classList.remove('hide');
html.addEventListener('click', closeMenuOnBodyClick);
}
function closeMenu(){
// add class to the menu to make it show
menu.classList.add('hide');
// add event listener to the html element
html.removeEventListener('click', closeMenuOnBodyClick);
}
function closeMenuOnBodyClick(event){
closeMenu();
}
function closeMenuOnBodyClick(event){
// get the event path
const path = event.composedPath();
// check if it has the menu element
if (path.some(elem => elem.id === 'header-menu-sidebar')) {
// terminate this function if it does
return;
}
closeMenu();
}