Stagger and Timeline together with a random array

[Kristjan]

Animation I want: A dot fades out, fades in. Then another dot at some random other location does the same

 

Animation currently get: All of the dots fade out in random order then fade in in random order.

 

how I have to set my timeline to get the animation I want?

See the Pen aPObed by anon (@anon) on CodePen

[Carl]

Hi and welcome to the GreenSock forums,

 

Thanks for the demo.

Please try

 

var mummudRepeat = new TimelineMax({repeat:-1})
        var mummud=$('#mummud > g path'),mummudArray=mummud.toArray();
        mummudArray.sort(function() {return 0.4-Math.random()});    
        mummudRepeat.staggerTo(mummudArray, 0.2, {opacity:0, repeat:1, yoyo:true},  0.4)

 

by repeating each staggered tween with yoyo:true each dod will fade out and then fade back in.
                    

See the Pen VqLLYE?editors=1010 by anon (@anon) on CodePen