Streaming live at 10am (PST)

Menu doesn't close after clicking link


#1

Live site: http://urakashi.webflow.io

Guys, I can’t get my menu to automatically close after clicking a menu item (that links to another section on the page).

What am I doing wrong?

Here is my site Read-Only: https://preview.webflow.com/preview/urakashi?preview=e2b524bc23494dbc10fab881d19a8176

Edit: Fixed read-only link.


Nav isn't closing after click? Hmmm
#2

You’re not doing anything wrong. The navbar element won’t close unless one of the following happens.

  • User clicks outside of navbar
  • User clicks the navbar menu icon
  • Page is reloaded

Since you’re using section links in the navbar none of those actions take place.

A solution is to add an interaction onto each link in the navbar to move the navmenu element 100% to the right. This way when clicked the page will scroll down to the appropriate section and the navbar menu will close simultaneously.


#3

Thanks for the reply @matthewpmunger !

However, on this page I’ve built before, the menu closes upon clicking/tapping a section link (access) : https://www.pecbar.jp

Could it be a difference between menus that drop down from the top VS from the side?

PS you gotta shrink the window to tablet size for the mobile menu to appear.


#4

:thinking: Maybe it could be that it is a side menu or the fixed position is overriding something.


#5

Perhaps. Perhaps. I’d rather keep the menu on the right if possible. Maybe Webflow staff has some more insight?


#6

Only possible with custom code.

<script>
$('.w-nav-menu').on('click', 'a', function() {
  $('.w-nav-button').triggerHandler('tap');
});
</script>

Also, feel free to contact me for further code help and/or customization of third-party plugins


#7

Fantastic, seems to be working like a charm! Thank you so much @samliew !