Stagger from center object and out?

[Devotee007 19 Likes (Newbie)]

Hi,

 

Is it possible to stagger from center and out? I have 5 objects in a row and would like the center one (1) fade in from bottom to top and then the two ones next to it (2 and 3) fades in and last the two on the end (4, 5) comes in.

 

4 2 1 3 5

 

//Devotee007

 

 

[Diaco 1,997 Likes (Superhero)]

Hi Devotee007 

 

pls try this :

 

var l = elems.length ;
TweenMax.staggerTo(elems,0.4,{y:50,cycle:{delay:function(i){return Math.abs(Math.floor(l/2)-i)*0.1}}});

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

[Carl 11,167 Likes (Superhero)]

awesome, Diaco!

[Jonathan 5,392 Likes (Superhero)]

Nice job Diaco!

[Devotee007 19 Likes (Newbie)]

Nicely done Diaco!

 

Thanks for the help, but I don't have a Club Greensock membership, so I can't use that method. Or maybe I do something wrong.

 

//Devotee007 

[PointC 14,427 Likes (Superhero)]

Hi Devotee007  ,

 

Diaco is just using splitText for his brilliant demonstration. His solution works just fine with some plain old box divs and no splitText plugin. 

 

Here is a quick example using his solution and some simple divs:

See the Pen BjmMpv by PointC (@PointC) on CodePen

 

PS For the record, I highly recommend a membership because the extra plugins are awesome.  

[Devotee007 19 Likes (Newbie)]

Thanks for clearing it up, PointC, I'm quite new at this. I will consider getting a membership, Greensock is really awesome!

 

//Devotee007