▼
Streaming live at 10am (PST)

Submenu dropdown closes main navbar menu on mobile

Design help Animations & Interactions
#1

Hi all,

I have a mobile navbar issue:
My Main Navbar has dropdown menus within it. Works fine on desktop sizing.

When in mobile, the main Navbar/hamburger menu opens fine. But if I click on one of the drop down menus to try and open those, the main navbar menu closes before I get a chance to click or even see the submenus.

Would appreciate any help!

Thanks!

Gene

Here is my public share link: https://preview.webflow.com/preview/totalseal?utm_medium=preview_link&utm_source=designer&utm_content=totalseal&preview=1074e0034045d42f29d7222b84fa126b&pageId=5ef7de093bde0a2ba0e75bb1&mode=preview

#2

Hi @gs3 try to remove the hover effect on the dropdown, because on mobile there’s no hover. So, ideally it shows when you press it.

Are you testing from the computer the mobile version?

Let me know if it works!

#3

Thanks Carlos! Yeah, that still didn’t work. I mean, it seems like it would work when testing on a desktop computer (even though in mobile breakpoints)…but when actually on a mobile device, it doesn’t work.

No worries, I’ve gotten rid of the sub-drop down menu and just created a dedicated page with categories.

#4

@gs3 ok great! Sometimes the best thing to do, is to keep it simple. Let me know if you go back to that layout and need some help.

Cheers,

#5

Thanks Carlos! Much appreciated!

1 Like
#6

Did anyone figure this out? I am having the same issue. I have drop down menus in my nav bar. In the preview on Webflow, it looks fine, but on the actual site, when you click on the dropdown icon, it closes the whole mobile menu so that you can’t browse the submenus or click on them.

#7

Hi @SFogel, do you have the site example?

Let me know!

#8

I’m not sure what caused the issue but it was very urgent, so I instead recreated the menu and made it only show on mobile.