Hamburger menu interaction

The hamburger menu doesn’t transform to what it should be after second click, can anyone help me to have a look? thanks.
https://preview.webflow.com/preview/yoyoyoyoyoyo111?preview=ab093694bec8417b18f977acfecbbe93

Hey @Hang_Ng

You just need to set the top & bottom menu blocks to “move to origin”.

Open your interaction and go to the click actions for the top/bottom blocks. For the second click action, click on the “move” box, don’t add any values and close it. It’ll set the move action to “move to origin”.

Job done :smile:

i did, but somehow the hamburger menu become something like this.

Hey Hang

Can you publish an updated link for me to check out? I’ll see if I can identify the problem

here you are.
https://preview.webflow.com/preview/yoyoyoyoyoyo111?preview=cef0fd74552e9e9a6af329a651c6e1b3

Thanks Hang

Neither the top or bottom hamburger elements are showing as “move to origin” on second click:

All you need to do here:

  1. click on the current second click interaction (your existing rotate 0 degrees)
  2. click on the move button. Don’t add any movement values, just let the window open, then close it.

You should now have an interaction title “move to origin” added as below:

This will ensure that your menu elements return to their original placements when you close the menu.

Just do that for both the top and buttom hamburger animations & it should look great. Just tried on your preview link & it worked just fine :smile:

2 Likes

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