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

What is Framer? Join the Community
Return to index
Suhaila B
Posted Aug 02 - Read on Facebook

Hey everyone! I just started using Framer today but I'm having some issues with using delays.

I have a layer (which I imported from Sketch) and want it to automatically animate into the page automatically after another animation is done. So I'm using the .onAnimationEnd function and everything works (repositioning, timing, etc) except the delay. If I set the delay to anything other than .5, the layer starts glitching onto the screen (as in it animates in but in a very janky way and inches in and out slowly in the process).

Any ideas?

3 Comments

Brian Williams

Share your code and we can have a look at helping

Suhaila B

Thanks! Here's the code:

# Import file "Intro" (sizes and positions are scaled 1:3)
sketch = Framer.Importer.load("imported/[email protected]")

sketch.Loading.animate
properties:
rotationZ: 640
curve: "ease"

sketch.Loading.onAnimationEnd ->
sketch.Loading.animate
properties:
opacity: 0
curve: "ease"
time: .5
sketch.Paging0.animate
properties:
x: 134*3
y: 439*3
curve: "ease"
time: .5
sketch.Get_Started.animate
properties:
x: 40*3
y: 507*3
curve: "ease"
time: .5

sketch.Get_Started.onAnimationEnd ->
sketch.Zero.animate
properties:
x: -900
curve: "ease"
time: .5
delay: 1
sketch.One.animate
properties:
x: 68*3
curve: "ease"
time: .5

sketch.One.onAnimationEnd ->
sketch.One.animate
properties:
x: -900
curve: "ease"
time: .5
sketch.Two.animate
properties:
x: 68*3
curve: "ease"
time: .5

Trevor Phillippi

The issue is that onAnimationEnd is being called infinitely, since you listen for animations ending, and then animate that objects that are already listening. In the code attached, I set two flags to guard against this happening, and ensure they're only called once.

Also, in the future, it's easiest to help if you can hit the "Share" button in framer and paste the link 😊 (provided you aren't working on anything confidential)

Read the entire post on Facebook