CODEWITHSUNDEEP
tweengsap
ADTC
ADTC

Reputation: 10086

One Tween object on multiple objects with different animations

Using GSAP, I want to create one TweenLite or TweenMax object which acts different animations (intended to play in parallel) on multiple different objects.

How can this be done? I have only seen allTo which applies same animation on an array of multiple objects.

It is important to get one tween as I need to pass it to ScrollMagic.

I figured I can use TimelineLite or TimelineMax to do this too, since that's OK with ScrollMagic.

var timeline=new TimelineMax();
timeline.to(object1, duration, animation1, 0);
timeline.to(object2, duration, animation2, 0);
timeline.to(object3, duration, animation3, 0);

However, is it possible purely using TweenLite or TweenMax? Or the timeline is the only way to go?

Upvotes: 1

Views: 4170

Answers (1)

Jonathan Marzullo
Jonathan Marzullo

Reputation: 7031

If you were to just use TweenMax and not TimelineMax.. then you could just use method chaining, and chain your tweens using TweenMax

Using TimelineMax would be give you greater control.

You could also chain with the TimelineMax constructor:

 var timeline = new TimelineMax().to(object1, duration, animation1, 0)
                                 .to(object2, duration, animation2, 0)
                                 .to(object3, duration, animation3, 0);

Or just do like you were doing, but with chaining:

 var timeline = new TimelineMax();
 timeline.to(object1, duration, animation1, 0)
         .to(object2, duration, animation2, 0)
         .to(object3, duration, animation3, 0);

See TweenMax docs for more information: http://greensock.com/docs/#/HTML5/GSAP/TweenMax/

Upvotes: 1

Related Questions