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

What is Framer? Join the Community
Return to index
Ben Rodenhäuser
Posted Feb 08 - Read on Facebook

Hi folks, I am trying to move around some layers in stages. That is, I want all layers in a certain array to move a bit, and once they have stopped moving move them again. I have created a toy project to try it out, but can't seem to get it to work. Could anyone perhaps have a look what I am doing wrong here?

4 Comments

Krijn Rijshouwer

There are 3 little issues with your current proto.

1. The animationEnd is being listened to on a new animation not the one you start. You should index it in a variable.

2. There is the issue that you're only running the last layer in the array after the animationEnd. This is an async issue in that for loop. You can solve this by using do().

3. The second moveX animation is already created before the animationEnd triggers the start. You could use a callback to resolve this and put all the intelligence in the moveX (cleaner) or just put it in another function.

Callback solution → http://share.framerjs.com/7qtbvc7a0wly/
Solution for the way you set it up right now → http://share.framerjs.com/co5v6xltnmte/

Hope it helps!

Ben Rodenhäuser

Super-helpful, thanks a lot!

Ben Rodenhäuser

Krijn, thanks again for your help. I was wondering how to set things up if one wanted to repeat the "move" animation a preset, but arbitrary number of times, so I came up with this: http://share.framerjs.com/ewn7s7994ojn/ This works, but it's essentially a while loop in disguise ... so I am wondering if this set-up would be considered "bad practice"?

Krijn Rijshouwer

Nice! No bad practise! This is the way I'd probably set it up. Only improvement I see here is that if statement on the beginning, you can remove 2 lines ;)

(it might also be nice to prefix that "n" param as 1 so it'll by default run one time making the "n" param not required)

http://share.framerjs.com/f5llu2178llq/

Read the entire post on Facebook