I have a menu that works fine on desktop, but the links do not work on any other breakpoint in either the designer or the published site. The links in the hero text seem to be hit or miss as well. I can get them to work sometimes in the designer, and sometimes in a published window, sized for mobile. Nothing is working on the actual mobile device. I feel like I’ve tried every variable, but surely I’m missing something.
edit: please only refer to the homepage as site in under construction and it is the furthest built
update: I’m starting to think that there might be something sitting on top of the page, covering the viewport over everything else, but I can’t figure it out. I don’t think anything has a set Z index, and the menu is on top in terms of the document structure, so it doesn’t make sense to me. Not to mention the problem is not occurring on desktop.
The element that is causing you issues is the div.w-nav-overlay. I am heading out on a road trip, so I don’t have time to debug your design today. Hopefully this will point you in the right direction.
Thanks, Jeff. After inspecting the published site page, this is definitely the issue. I never created an element called w-nav-overlay. Is it coming from the built in Nav Bar component somehow? Is there any way to prevent the overlay from occurring? It only makes itself present after the menu is opened, thus preventing all links from being accessed after the menu is opened. The links on the homepage are clickable before the menu is opened and closed.
I think I fixed it by adding some custom code to the header to ignore it. (pointer-events:none)
Should I be ok with using this method to fix, or is there a more elegant solution?
After doing some additional research, it looks like this is a long standing bug with the nav bar component. I can’t seem to find any other way of getting around it.