Using Navbar widget, in mobile mode, menu doesn't disappear on click when using custom js code

Design help General
1

I’m using custom jquery trigger code on menu items. I’m basically loading part of contents of href into a div with ajax. For this to work, I have to do a .preventDefault(). However, this disables the menu’s built-in function of hiding the menu on click. Is there a way I can call this function directly? I tried to add a handler on the mobile menu item directly, but that doesn’t work since onload, it’s display:none, so doesn’t exist.

Even if the only thing I do on my trigger is the .preventDefault(), the menu hiding behaviour is compromised. However, that does not happen is my href is simply “#”. I need to keep the hrefs intact for search engines and other reasons.

So how could I “manually” trigger the closing of the menu?

Thank you

2

I can do this:

$('.w-nav-overlay').css('display', 'none'); // hides menu
$('.w-nav-button').removeClass('w--open'); // puts menu icon back to original state

And the menu will disapear and the button will go back “visibly” to it’s normal state. However, since the “close menu” event didn’t get triggered, I have to click twice after that on the menu icon to have the menu appear.

3

Anyone on webflow has any input on that?

4

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.