Trigger animation by variable change or button click

I gave up trying and came to ask because it should be something simple and I’m not able to do it the way I need to…

I have two Divs. each one with its animation. The animations are working fine but when loading the page. What I need is when I click a button the animation of DIv1 is triggered and after a delay the animation of the second DIv.

I created a new state of the div where the animation exists (I was left with 2 states: default and animation), but I couldn’t call this state. I did the bind of the state in a variable but I also didn’t understand there in the formula pane how to say that that state should be called only if the variable is true.

Even using AI it didn’t work, it only consumed tokens.

I didn’t find this kind of information in the documentation, I didn’t find an option for it in the workflows and the topics here don’t clarify what I need, or at least I didn’t find one.

I hope you can help.

1 Like

I have a similar problem… I need, for example, that when a button is clicked, that button smoothly disappears and then another button smoothly appears in its place. I’ve tried many different methods (including state variables for each button, time delayed in workflow), but I don’t get the “smooth element change” effect. Always when I click a button, another one appears immediately, there is no smooth transition effect… This is probably because the state variable changes instantly (one variable “show”, the other “hide”).

It would be convenient, for example, to add the possibility of animation in a workflow. That is, in a workflow we specify “update variable” and then the next workflow, for example, can specify “animation”. I have not found how to do this.

Are there any ways to solve this issue? This, as the author pointed out above, seems to be a simple question, but I don’t know how to implement it… I would be glad to receive any hints.