Jump to content
Search Community

how to loop entire tweenmax animations with onComplete callbacks

siva nargana test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

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

 

TweenMax.to(".div1",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){
  TweenMax.to(".div2",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){
    TweenMax.to(".div3",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){
      TweenMax.to(".div4",0.5,{opacity:1,ease: Linear.easeOut,onComplete: function(){}});
    }});
  }});
}});

See the Pen XELdmy by sivanargana (@sivanargana) on CodePen

Link to comment
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) 

 

See the Pen XELdmy by sivanargana (@sivanargana) on CodePen

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

Link to comment
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});
tl.to(".div2", 0.5, {y:100});
tl.from(".div3", 0.5, {scale:2});
tl.from(".div4", 0.5, {rotation:360});

 

More info:

https://greensock.com/docs/TimelineMax

 

Also check out the position parameter:

https://greensock.com/position-parameter

 

Happy tweening.

:)

 

  • Like 5
Link to comment
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.
×
×
  • Create New...