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

What is Framer? Join the Community
Return to index
Nir Benita
Posted Nov 27 - Read on Facebook

Hey guys, contemplating with Framer.

I'm trying to loop through an array of animation objects, and `.start()` them to reveal a panel, or '.reverse()' them to hide the panel.

runAnim = (animObj, isVisible) ->
if isVisible
animObj.start()
else
animObj.reverse()

btn.on Events.Click, ->
panel.visible = !(panel.visible)
debugger
runAnim animObj, panel.visible for animObj in animations

Start works fine, however, the reverse does not.
I'm manipulating the `y` and `opacity` properties.

Thanks!

3 Comments

Jerry Lin

Benjamin Den Boer if I want to delay animB, how to write it?
(e.g. after 10s then start animB.)
or is there any function to change the props on animB?
Thanks!

I think I found it! It WORKS!!!
ani_A.on Events.AnimationEnd, ->
Utils.delay 2, ->
Rani_A.start()
----
But why this delay CAN'T work?
I mean, it animate immediately!

ani_tabDiv = new Animation
layer: $.tabDiv
properties:
y: 861
delay: 2
time: 1
curve: Bezier.ease

ani_tabDiv.start()

Benjamin Den Boer

Hey Nir Benita - you also have to start the reversed animation. The reverse() method doesn't automatically initiate an animation.

animA.start()
animB = animA.reverse()
animA.on Events.AnimationEnd, -> animB.start()

Nir Benita

I thought of that but was too sure it's not the case. Ugh!

Thanks :D

Read the entire post on Facebook