siva nargana

how to loop entire tweenmax animations with onComplete callbacks

Recommended Posts

how to repeat this kind of callbacks based animation, I cant repeat this entire animation, each tween start based on callback please answer this problem".div1",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){".div2",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){".div3",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){".div4",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){}});

Share this post

Link to post
Share on other sites

staggerFrom or staggerTo tweens only for  same class & same animation type,  but I need  different animations  and different class names with callbacks


1st tween run animation -1 (move left to right) on complete -- >

2nd tween run animation -2 (move right to bottom) on complete -- >

3rd tween run animation -3 (move bottom to left) 


 this entire animation should be a repeat is it possible ??

Share this post

Link to post
Share on other sites

Is there any reason you're not using a timeline for this?


TweenLite.defaultEase = Linear.easeNone;
var tl = new TimelineMax({repeat:-1});
tl.from(".div1", 0.5, {x:100});".div2", 0.5, {y:100});
tl.from(".div3", 0.5, {scale:2});
tl.from(".div4", 0.5, {rotation:360});


More info:


Also check out the position parameter:


Happy tweening.



  • Like 5

Share this post

Link to post
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.