Stagger blinking effect

[afulldevnull]

Hi!

 

First of all, thank you very much for making this excellent library.  I wish I would have found Greensock long ago, but better late than never.

 

I have a relatively simple problem, but I can't figure out an elegant way to animate it.  I have three circles, and I want the background color to change from green to red with stepped easing and hold for 1 second.  Then the next circle in line changes from red to green, and so forth. This is the effect I'm looking for:  

 

I think that TimelineMax.staggerTo is what I'm looking for, but I can't quite get it to work as expected.  Can anyone give me any pointers?

 

Thanks for reading!

 

Ty

See the Pen JdbvRo by tysmith (@tysmith) on CodePen

[Diaco]

Hi afulldevnull 

 

pls try this :

TweenMax.staggerTo(circles,1,{opacity:0.3,ease:SteppedEase.config(1),repeat:-1,repeatDelay:0.5,delay:-1},0.5);

See the Pen MwbGvx by MAW (@MAW) on CodePen

[afulldevnull]

Perfect! Thank you!!     

[Arvistas]

Awesome. Thanks a lot.