Technical Doc Page JavaScript Help

I used some light JavaScript for a menu button. It should show when the screen is below 755px. I keep getting it almost working, but it usually won’t close the menu when I click the button again. I tweaked the code and it stopped working, so I changed it back, but now it’s not working at all still. I’m going crazy! Please help me figure this out.
I just want the menu in the top right to open when clicked, then close if you click anywhere on the screen.

Hi, your menuFunction() needs to find the navigation, not the menu. The navigation is the element that is hidden.

Hah, I was getting so pissed I didn’t even notice I changed the wrong thing. Okay that fixed most, but it still won’t close when I click the icon again.

I would add and else to the end of your if statement. So:

if you find “hide”, remove it
else add “hide”.

I don’t think you need the show class.
Also, I saw 2 instances of the class .hide in your css.

Hope this helps.

Idk what I was thinking with the show class, thanks for pointing that out haha.
As for the 2 instances of .hide, that is so that when the screen is larger .hide has block display, but none display when smaller cause I need the larger screen to always show the menu. The 2nd one is under the media query.
The code originally had the else statement, and it worked, but once I added the code to hide when anything is clicked, that broke. So, I can click anywhere to close it, except the icon itself.

I don’t know. I did get the menu to show and hide by clicking the button, but I commented out the window.addEventListener function and added this to the if statement:

else if (!d.classList.contains(“hide”)) {
d.classList.add(“hide”);
}

Yea, doing that will make it work, but then if you click elsewhere on the page it won’t close, and it won’t close if you click on a section to go to. So, that is my predicament.

I was playing around with it and see there does not seem to be a quick fix. I did some searching and found something that might help.
Detecting a Click Outside an Element in JavaScript

Now that the forum is back up, thanks for your help! I was eventually able to figure out how to re-work the code to get it working exactly how I wanted.

Hey, that mobile menu is working great now! Nice job.

Thanks! Yea I realized the icon was in the way and needed to become part of the code. Glad I got it going cause now all my pages function great!