devin1229 Posted August 13, 2021 Share Posted August 13, 2021 I'm wondering if it's possible to use the registerEffect functionality to repeat animations, but with each animation having its own delay value. I'm trying to create a series of animations that fire off in sequence vs. all at once. I thought by using something like gsap.effects.pop('.circle', { delay: 1 }); gsap.effects.pop('.square', { delay: 5 }); Would work, but it doesn't. Is there an alternative way to do this, or is something like this completely unavailable? See the Pen BaRbpYq by devin1229 (@devin1229) on CodePen Link to comment Share on other sites More sharing options...
Solution GreenSock Posted August 13, 2021 Solution Share Posted August 13, 2021 That's because you didn't plug it into the tween that you're returning delay: config.delay, See the Pen JjNzzaE?editors=0010 by GreenSock (@GreenSock) on CodePen You can put anything you want into the config. Just make sure you use it inside your effect in whatever way you intend. 1 Link to comment Share on other sites More sharing options...
nico fonseca Posted August 13, 2021 Share Posted August 13, 2021 Hey @devin1229 you can access to the delay property in the same way you did with the duration, so you can do something like this: return gsap.to(targets, { duration: config.duration, scale: 1.3, ease: "power.inOut", yoyo: true, repeat: 1, delay: config.delay, }); or you can add your effect to a timeline, for example: //with extendTimeline: true var tl = gsap.timeline(); tl.yourEffect(".class", {configProp:"value"}, "+=position"); //without extendTimeline: true, you'd have to do this to add an instance to the timeline: tl.add( gsap.effects.yourEffect(".class", {configProp:"value"}), "+=position"); 3 Link to comment Share on other sites More sharing options...
devin1229 Posted August 13, 2021 Author Share Posted August 13, 2021 I clearly need new glasses. Thank you @nicofonseca and @GreenSock 2 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