This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Nick Andrews
Posted Feb 12 - Read on Facebook

Hey everyone, I had some spare time to download the Framer trial and play around this weekend. Loving it so far! I'm trying to do something that I think would be super simple, but I can't figure it out. I have an array of 6 circle elements, and a for loop that loops through each circle and applies an animation + delay on each circle. I was able to reverse that animation and now it just loops forever. My question, is how do I apply a 3 or 4 second pause between the initial animation and the reverse animation?

8 Comments

Stephen Crowley

Utils.delay 3, -> secondAnimation

Kenneth Spry

Or nest what Stephen said in
firstAnimation.onAnimationEnd ->
Utils.delay 3, ->
secondAnimation.start()

Nick Andrews

How would I apply the utils delay to the 2nd animation? Currently I have my first animation setup in a for loop, then my 2nd animation is just the first one reversed, so I have:

reverse = forward.reverse()
forward.on Events.AnimationEnd, reverse.start
reverse.on Events.AnimationEnd, forward.start

Nick Andrews

nevermind got it, thanks guys!

forward.onAnimationEnd ->
Utils.delay 3, ->
reverse.start()

Nick Andrews

worked :)

Stephen Crowley

I was just making you an example, haha. Glad you got it working!

Nick Andrews

Stephen Crowley & Kenneth Spry thanks for the quick replies. I'm working on an animated Tyler logo right now for possible load screens. Framer is so fun haha

Stephen Crowley

I did one of those in Framer for Tyler Tech back in the day!

Read the entire post on Facebook