Reset hamburger-menu X-animation on anchor link

Design help Animations & Interactions
1

Hey there! Im having some problems figuring out how to fix my mobile menu button. The way it is now I can toggle it to show and hide like it should, and the icon transforms to an X and back to hamburger. However if I click on an anchor-link the menu closes like it should and it scrolls down, but the menu icon doesn’t reset.

The way it is built is with first and second click. I’ve tried setting the second click interaction on the anchor-link, but that doesn’t work for some reason.

Not sure if my explanation it spot on, but to see for yourself just set the viewport to mobile and try to click on the “Om oss” link.

Thanks!

Here is my site Read-Only: https://preview.webflow.com/preview/somlos?utm_medium=preview_link&utm_source=designer&utm_content=somlos&preview=e696f88aed131d2ee718f8ed37b8fdd0&mode=preview

3 Likes
Mobile Navbar animation problem
2

Hi @Mabero1, thanks for your post. When using the navbar widget, instead of using the interaction on the mouse tap of the menu button, assign those interactions to the menu open/close triggers, see my quick video:

I hope this helps

14 Likes
3

Thanks a lot! Didn’t know about the menu opens/closes interaction. Also thanks for putting the time in to make a video. Made it really easy to understand :slight_smile:

2 Likes
4

This made my day. Thanks for the question @Mabero1 and thanks for the solution @cyberdave.

5

Thanks, Dave. Thank you for making the video. :grinning:

6

Thank you CyperDave! I’ve learnt something new today too!

7

Thank you Cyberdave! Spot on! :raised_hands:

8

Thanks, worked as good as it was easy!

9

Hi!

I have the same problem, but this video is not working anymore.

Here is a read-only link to see the problem:
https://preview.webflow.com/preview/test-hamburger-menu-anchor?utm_medium=preview_link&utm_source=designer&utm_content=test-hamburger-menu-anchor&preview=5e2e7784207c48797678ad014ea8b007&workflow=preview

Best,
Špela

Hamburger icon doesn't animate after clicking an anchor
10

Hey Dave! I have the same problem but the video isn’t available no longer. Could you please share it again?

11

Hi everyone! @cyberdave 's screenshare isn’t available anymore so I made one walking through the steps he explained in his comment:

1 Like