Closing Nav Menu properly on section link

Design help General
1

Hey there,

Newbie to Webflow and I’m stuck in something thats probably very simple to fix.

I have created a little “= x” animation for my hamburger menu which is working. The nav links in the menu are going to anchored sections on the same page. Thats also working.

The problem I am having is that when I click on a nav link to go to a section, the nav menu isn’t closing properly, the “x” is still there from the animation and if I click on it again, the nav menu works but the animation is now the wrong way. I have tried to add additional animations to the nav links themselves to complete the loop so to speak but it doesn’t seem to work, so I deleted them again.

Is there a way to close the nav menu properly when I click on a nav link thats going to a section on the same page? Is it possible that code is needed?

Appreciate any and all guidance :slight_smile:

Here is the project:
https://preview.webflow.com/preview/victor-blanes-pico?utm_medium=preview_link&utm_source=designer&utm_content=victor-blanes-pico&preview=65f62d2ae7c3a9c985ac16ce6991052f&workflow=preview

Thanks!
A

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Hey @adamf

Your animation needs to be set in a different place. Rather than adding it to the click of menu button you need to append it to “Nav open/Nav Close” events. That way it will work even if you click on the links and they close the nav.

You can see where you can do that here Loom | Free Screen & Video Recording Software | Loom

Also remove the animation triggered from the menu button itself and any other elements so that it doesn’t interfere with the new setup

Let me know how it went

3 Likes
3

Ahhh so simple! Thank you so much @marko-ninja! Working now :slight_smile: