this_is_dhananjay
KPCKevin Powell - Community
•Created by this_is_dhananjay on 5/13/2024 in #front-end
Help with JS logic to close menu if search is clicked, or vice-versa
Hello everyone,
I am currently working on my own website and have stumbled upon an issue with the functionality of mobile menu and search toggles in the site header.
Here is the link to a pen of my current code: https://codepen.io/is_dhananjay/pen/yLWyYjK
If you resize the window below 768px, the mobile toggle will kick in, hiding the menu item list. Clicking the menu toggle will then display the menu item list. Good so far.
But while the menu is open, if I click on the search button, the search container will open over the menu container. On the reverse end, if you open the search first, and then open the menu without closing search first, it will open, but behind the menu container.
I am still very new to JS, and here's what I am trying to achieve:
- If the menu toggle is clicked, first check if the search is open, if it's open, close it and only then open the menu.
- Same goes for the search toggle. If the search toggle is clicked, first check if the menu is open, close it, and only then open the search.
I would be great if I could get some help.
31 replies