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

What is Framer? Join the Community
Return to index
Amelia Liarakos
Posted May 02 - Read on Facebook

I've struggling with this for a couple hours and I can't seem to find a great example through Googling or figure it out on my own. How would I set up a looped animation that is applied to all the sub layers of a parent group?

I'm trying to make all of a certain UI element pulse by scaling it up and then scaling it back down to the original size. But I want that animation to repeat indefinitely. So far I've gotten one element to pulse on the loop and I've gotten all the elements to scale up but not scale back down. I can't seem to get the loop to apply to an array of layers.

Help?

6 Comments

Trevor Phillippi

Here is a quick example, does this achieve the sort of result you're looking for? http://share.framerjs.com/rhkni246lcxc/

Amelia Liarakos

I guess where I'm getting confused is I'm trying to do it over an array of imported Sketch layers. Would that example still apply?

Trevor Phillippi

http://share.framerjs.com/b8v3nar9u36d/ updated with a sketch imported group

Amelia Liarakos

YES THANK YOU. Can you explain why that's making it bounce between the two scale values? Is it looping through the last layer.onAnimtionEnd call and checking the value with the if statement?

Trevor Phillippi

yeah basically it checks what the current scale value is to see if it needs to scale up or down. Alternatively, you could listen for onAnimationEnd, and then keep a flag for like isScaledUp = true/false, and then call a function to scale up or down accordingly. Whatever works for you 😁

Amelia Liarakos

Thank you!!

Read the entire post on Facebook