Hey guys,
I’ve been racking my brain on this for ever. Why does the hamburger button snap back to the cross at the end of its closing animation?
I’m sure it’s something super simple I am missing.
Any help would be greatly appreciated.
Preview Link:
https://preview.webflow.com/preview/biker-co?utm_source=biker-co&preview=2eafa115e3cfd76e15ef72f64a1981b4
Thanks heaps!
Hi @damiandp,
Very strange. I tried a few variations with the interaction you created and I couldn’t isolate the exact reason for the issue, but it has something to do with the ‘linkmenu’ element.
If you delete that target element from your ‘Burger Button Wrapper’ Interaction everything works as expected.
I couldn’t nail down why this has an effect on your interaction, perhaps someone else may have more insight.
Hope that helps
Keiran
Hey @knk,
Thanks for your response! Yeah I noticed that too, just not making sense to me ‘why’ this is happening.
Thanks for your help!
This is happening because ‘first click’ is being toggled on the exit. This is odd.
I had similar issue with modulating a button with interactions.
My best work around was to use two seperate click interactions instead of one interaction.
Create Button 2 on your Preloader using same classes
Then
Button 2 in this context will always convert your X into ≡
Hey @miekwave, thanks for the response!
So sorry but this isn’t making sense to me! Could you explain in more detail? Or provide a preview link?
Thanks heaps!
Using your own project.
Under Interaction:
Assign Button 1: Click Interaction First Click = Burger Button In 3
Assign Button 2: Click Interaction First Click = Burger Button Out 4
*do not use Second Click Interaction, as its conflicting with other interaction/timings
Modify ‘Button’ Classes
‘Button 2’ should equal the end state of ‘Burger Button 3 interaction’
‘Button 1’ should equal the end state of ‘Burger button Out 4’
Tweak Burger Button In 3 / Burger Button Our 4 and Button Classes accordingly
*please pardon my poor mousemansship, lol
