Skip to main content
Question

How to do 3 step button hover animation


Stefan_Sabadas

Im trying to make this 3 step animation, for which i created 3 variants of the same button. the first step, between variant default (topmost) and variant 2 (middle) is set to While hovering, then the step from variant 2 to variant 3 is set to After delay, to let the first animation play out. the problem is that i cant get the button to revert to the Default state on Mouse leave, it just freezes at the end of the second step. I have all this within a component with the 3 states and im testing the animation on an instance of the component (in the Default state).

thanks in advance.

This topic has been closed for comments

3 replies

tank666
  • 4857 replies
  • June 2, 2022

Add the “Mouse leave” interaction from the third button to the default button.


Stefan_Sabadas
  • Author
  • New Participant
  • 13 replies
  • June 2, 2022

thanx for the reply! i did that, but then the button doesnt animate at all, not even the forward on hover animation.

le: i think i fixed it, had to change the first step to Mouse enter. now it works properly.


  • 0 replies
  • July 2, 2022

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


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings