ahhhhhhh
This commit is contained in:
parent
e2e7e90e01
commit
c46d66daef
1 changed files with 13 additions and 13 deletions
22
burger.js
22
burger.js
|
@ -9,15 +9,15 @@ function toggleMenu() {
|
|||
|
||||
// Apply animations based on the menu's visibility
|
||||
if (menu.classList.contains("active")) {
|
||||
menu.style.animation = "slideIn 0.3s forwards";
|
||||
document.addEventListener("click", closeMenu);
|
||||
menu.style.animation = "slideIn 0.3s forwards"; // Menu is shown here
|
||||
document.addEventListener("click", closeMenu); // Event listener added to close menu
|
||||
} else {
|
||||
menu.style.animation = "slideOut 0.3s forwards";
|
||||
// Remove the event listener to close the menu
|
||||
menu.style.animation = "slideOut 0.3s forwards"; // Menu is hidden here
|
||||
// Remove the event listener to close the menu (this line removes the event listener, not closes the menu)
|
||||
document.removeEventListener("click", closeMenu);
|
||||
// Reset animation after it's completed
|
||||
menu.addEventListener("animationend", () => {
|
||||
menu.style.animation = "";
|
||||
menu.style.animation = ""; // Animation reset after hiding menu
|
||||
}, { once: true });
|
||||
}
|
||||
}
|
||||
|
@ -26,13 +26,13 @@ function closeMenu(event) {
|
|||
const menu = document.querySelector(".menu");
|
||||
// Check if the click is outside the menu and not on the burger icon
|
||||
if (!menu.contains(event.target) && !event.target.classList.contains("burger-menu")) {
|
||||
menu.style.animation = "slideOut 0.3s forwards";
|
||||
// Remove the event listener to close the menu
|
||||
menu.style.animation = "slideOut 0.3s forwards"; // Menu is hidden here
|
||||
// Remove the event listener to close the menu (again, this line removes the event listener)
|
||||
document.removeEventListener("click", closeMenu);
|
||||
// Reset animation after it's completed
|
||||
menu.addEventListener("animationend", () => {
|
||||
menu.classList.remove("active");
|
||||
menu.style.animation = "";
|
||||
// After animation completes, remove 'active' class and reset animation
|
||||
menu.addEventListener("animationend", function() {
|
||||
menu.classList.remove("active"); // 'active' class removed after animation completes
|
||||
menu.style.animation = ""; // Animation reset after hiding menu
|
||||
}, { once: true });
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue