Jump to content
Search Community

TimelineMax ignores .set on replay?

todorone 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

Hey guys,
Thanks a lot for such an awesome tweening library i'm a big fan, used it for 6 years in game dev, now diving into it on React application.
I have a question: does TimelineMax respects .set() when restarting tween? Because it does not work for me - i tried all the combinations - set, to with 0 duration, etc.

 

This is the code - first 2 operations works only first time playing animation and doesn't work when i call .replay()

this.inAnimation = new TimelineMax({ paused: true })
  .set(this.rootRef, { autoAlpha: 1, zIndex: 10, x: '0%', immediateRender: false })
  .to(this.wrapperRef, 0, { x: '0%', rotationY: 0, immediateRender: false })
  .fromTo(this.bgRef, this.props.duration * 0.95,
    { x: '100%', boxShadow:'0 0 10px 10px rgba(0, 0, 0, .5)', immediateRender: false },
    { x: '0%', boxShadow:'0 0 20px 50px rgba(0, 0, 0, .5)', clearProps: 'boxShadow',
    delay: this.props.duration * 0.05 })
  .fromTo(this.contentRef, this.props.duration * 0.5,
    { autoAlpha: 0, immediateRender: false }, { autoAlpha: 1, delay: this.props.duration * 0.5 }, 0)
  .fromTo(this.tipRef, this.props.duration * 0.5,
    { y: '75%', immediateRender: false }, { y: '0%', delay: this.props.duration * 0.5 }, 0)
Link to comment
Share on other sites

Hi todorone :)

 

Welcome to the GreenSock forum.

 

I'm assuming you meant restart() as there is no replay() method. What would the expected behavior be here?

 

What you're describing sounds like what I would expect. The set() at the beginning of that timeline would fire immediately because it's the first one. Other set()s down the chain would wait their turn and should work fine on a restart(). 

 

If you could put that code into a demo for us and let us know what the expected behavior would be, we could could then give you a better answer. Here's some info about that.

 

https://greensock.com/forums/topic/9002-read-this-first-how-to-create-a-codepen-demo/

 

Happy tweening.

:)

  • Like 3
Link to comment
Share on other sites

Hello todorone, and Welcome to the GreenSock Forum!

 

Here is the link to the GSAP restart() method

 

https://greensock.com/docs/#/HTML5/GSAP/TimelineMax/restart/

  • restart()
    Restarts and begins playing forward from the beginning.
//restarts, not including any delay that was defined
myAnimation.restart();
 
//restarts, including any delay, and doesn't suppress events during the initial move back to time:0
myAnimation.restart(true, false);

:)

  • Like 2
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...