35 lines
1 KiB
JavaScript
35 lines
1 KiB
JavaScript
const showMenu = (listNavbar, btnOpen, btnClose) => {
|
|
listNavbar.classList.remove("hidden");
|
|
btnOpen.classList.add("hidden");
|
|
btnClose.classList.remove("hidden");
|
|
};
|
|
|
|
const hideMenu = (listNavbar, btnOpen, btnClose) => {
|
|
listNavbar.classList.add("hidden");
|
|
btnOpen.classList.remove("hidden");
|
|
btnClose.classList.add("hidden");
|
|
};
|
|
|
|
const listNavbar = document.querySelector(".list-navbar");
|
|
const hamburger = document.querySelector(".hamburger");
|
|
|
|
document.addEventListener("click", (event) => {
|
|
if (
|
|
!hamburger.contains(event.target) &&
|
|
!listNavbar.contains(event.target)
|
|
) {
|
|
hideMenu(listNavbar);
|
|
}
|
|
});
|
|
|
|
hamburger.addEventListener("click", (event) => {
|
|
const btnOpen = document.querySelector(".fa-bars");
|
|
const btnClose = document.querySelector(".fa-xmark");
|
|
|
|
event.stopPropagation();
|
|
if (listNavbar.classList.contains("hidden")) {
|
|
showMenu(listNavbar, btnOpen, btnClose);
|
|
} else {
|
|
hideMenu(listNavbar, btnOpen, btnClose);
|
|
}
|
|
});
|