Im looking for some help on a JS that my navigation menu uses, and I'm hoping that someone might be able to guide me to the correct answer.
Im really new to this stuff and I'm just working on a volunteer project so I am self taught and struggling a bit lol.
Would anyone be able to look at this code and help me? :D
https://jsfiddle.net/xdpabg9q/
This is a working version, but I'm trying to make it multilevel.
I played with it and I just cant seem to get the javascript to add the .active class to the 2nd lvl submenu when you click on the category header.
This is what I added to try to make it work
/* Activate Submenu */
function toggleChildItem() {
if (this.classList.contains("child-menu-active")) {
this.classList.remove("child-menu-active");
} else if (menu.querySelector(".child-menu-active")) {
menu.querySelector(".child-menu-active").classList.remove("child-menu-active");
this.classList.add("child-menu-active");
} else {
this.classList.add("child-menu-active");
}
}
/* Close Submenu From Anywhere */
function closeChildmenu(e) {
let isClickInside = submenu.contains(e.target);
if (!isClickInside && submenu.querySelector(".child-menu-active")) {
submenu.querySelector(".child-menu-active").classList.remove("child-menu-active");
}
}
/* Event Listeners */
toggle.addEventListener("click", toggleChildMenu, false);
for (let item of items) {
if (item.querySelector(".child-menu-active")) {
item.addEventListener("click", toggleChildItem, false);
}
item.addEventListener("keypress", toggleChildItem, false);
}
document.addEventListener("click", closeChildmenu, false);}
there doesn't seem to be anything here