webdlh-net/wwwroot/js/Navbar.js

30 lines
990 B
JavaScript

document.addEventListener("DOMContentLoaded", function () {
const menuButtons = document.querySelectorAll('[id^="dropdown-button-"]');
const megaMenus = document.querySelectorAll('[id^="mega-menu-"]');
menuButtons.forEach((button) => {
button.addEventListener("mouseenter", function () {
const menuNumber = this.id.split("-")[2];
const targetMenu = document.getElementById(`mega-menu-${menuNumber}`);
megaMenus.forEach((menu) => menu.classList.add("hidden"));
if (targetMenu) {
targetMenu.classList.remove("hidden");
}
});
});
const nav = document.querySelector("nav");
nav.addEventListener("mouseleave", function () {
megaMenus.forEach((menu) => menu.classList.add("hidden"));
});
megaMenus.forEach((menu) => {
menu.addEventListener("mouseenter", function () {
this.classList.remove("hidden");
});
menu.addEventListener("mouseleave", function () {
this.classList.add("hidden");
});
});
});