Animation Only When Previous Animations is Complete

I have an animation in an event for a modal to fade in and out with user activity. How can I stop it firing repeatedly causing it to flicker? I really want to be able to say trigger only when previous animation is complete.

1 Like

you could add a pause for the same amount of time as the previous animation.

Darn. Just tried that. The events seems to be queued so they just keep firing, just delayed.

i find the animation library temperamental, ask yourself if you really need this quirk.
doesnt seem to provide user with any valuable feedback.

Animations are never really necessary are they?. But this app does need to look very cool and slick so I’d like to find a way. I actually have a plugin on the same page, triggered by the same source that uses:

$(“.element”).fadeIn();

And that works just fine. So maybe I’ll try and create a little plugin just for the fade in and out.

But thanks for the suggestion Beau, I was hoping that would work.

it can work. you just have to do some extraaas
set a state for when animation is in progress, have the pause, then change state to animation finished. only animate again if current state isnt animating.
if that makes sense fbhjdksjfkdhds

1 Like

It does. I’ll try that. Thx.

Good tip, @anon65040322. Bubble is kinda begging for a new animation plugin though, y’know?

1 Like

Have there been any updates to this? Currently trying to have a group fade out as the next one fades into the same place. I thought the next animation would start once opacity hit 0, but they animate on top of each other and it doesn’t look great. Is the only solution to set and change states?

1 Like