Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
steve5000

re-triggering Timelinemax during animation

Recommended Posts

Hi All,

 

I have created a timeline which triggers an animation of a few lines of text and a couple of images. I heavily simplified the code to keep it simple in my Codepen example.

 

My problem is that when I click to re-trigger the animation whilst it is already animating, the animation starts behaving in a way that I would not expect it to. Some of the text and/or images fade out or stop loading.

 

I'm two months into Javascript and GSAP so I'm sure it's down to my logic. I just cannot work out how to stop this happening. 

Help will be very much appreciated.

 

Thanks for your time.

 

Steven

See the Pen YPQyqy?editors=101 by anon (@anon) on CodePen

Link to comment
Share on other sites

Hi steve5000  :)

 

you can use .isActive() to check if your tween/tl is playing or not , and if not .restart() :

// Click "NEXT" button functionality -------------------------
$("#next").click(function(){
if(!tlB.isActive()){
  // Text array cycle

  // Transition animations
 tlB.restart();
 }
});
var tlB = new TimelineMax({paused:true});
tlB.staggerFrom(".stag", 0.5, {x:-10, opacity:0, ease:Back.easeIn}, 0.15);

or just using restart .restart() :

// Click "NEXT" button functionality -------------------------
$("#next").click(function(){
  // Text array cycle

  // Transition animations
 tlB.restart();
});
var tlB = new TimelineMax({paused:true});
tlB.staggerFrom(".stag", 0.5, {x:-10, opacity:0, ease:Back.easeIn}, 0.15);
  • Like 2
Link to comment
Share on other sites

Thanks Diaco.

 

You have made me very happy this morning. Works perfectly.

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.
×