marko krstic Posted February 16, 2022 Share Posted February 16, 2022 Hello dear GreenSockers. Not sure if it's ok to ask this as it's between gsap and javascript. I have 9 lines and 9 circles and I would like to make random path animation with random delay so they don't start at the same time and they don't start in order 1 to 9. See the Pen BammJVE?editors=1010 by krstivoja (@krstivoja) on CodePen Link to comment Share on other sites More sharing options...
mikel Posted February 16, 2022 Share Posted February 16, 2022 Hey @marko krstic, There are a number of options. Here is an example stagger from:"random" See the Pen OJROYeb by mikeK (@mikeK) on CodePen Or here are some other suggestions See the Pen vYLygdY?editors=0010 by mikeK (@mikeK) on CodePen Happy tweening ... Mikel Link to comment Share on other sites More sharing options...
marko krstic Posted February 16, 2022 Author Share Posted February 16, 2022 Thanks @mikel for the directions. Will investigate more about gsap.utils.random Link to comment Share on other sites More sharing options...
Solution Carl Posted February 16, 2022 Solution Share Posted February 16, 2022 Hi @marko krstic here I looped through all the circles and assigned them an animation along a path. the animations have random delays which means they won't start in order 1 - 9. see if this works for you See the Pen OJOOZXo?editors=0010 by snorkltv (@snorkltv) on CodePen *edit: I changed the delay so that the first circle starts immediately at time:0 and the rest have a random delay using delay: index == 0 ? 0 : "random(0.1,5)", 4 Link to comment Share on other sites More sharing options...
marko krstic Posted February 16, 2022 Author Share Posted February 16, 2022 Awesome @Carl This was what I was aiming for! 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now