Jump to content
GreenSock

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

GSAP tween value storing issue - timeline and props clear not enough?

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

I'm trying to create a rudimentary slideshow prototype that plays html container slides, loading their matching gsap animation definitions - on a temporary timeline on the fly, playing it, and then removing it (hide method, l326).

The pen has two slides, when you play forward/backwards, the animation plays as expected - as the same timeline animations/properties are played back/forwards on navigation. But when you press the "jump to 1st" button on the second slide (which disrupts the linearity by playing "in" instead of reverse out) tween values that are not changed from 1 between the two timelines (the blue and red box's scale) remain unchanged (0.65, from the "out" animation).

How is this possible? If you look at the above method, the timeline is invalidated, the element properties cleared... how was the 0.65 scale from the "out" animation retained?

(sorry for the complex example code, had to chop down a larger code, I hope the above description is clear enough)

See the Pen dGOgQz by poisonborz (@poisonborz) on CodePen

Share this post


Link to post
Share on other sites

Serious? There's no telling what you're doing in 700 lines of code. Why don't you try setting your timeline to its starting state before doing whatever it is that you're doing.

_this.currenttimeline.seek(0).invalidate();
  • Like 2

Share this post


Link to post
Share on other sites

Welcome to the forums.

 

Unfortunately we can't possibly start digging through that. For a rudimentary slideshow with 2 slides I'm confident the issue can be clearly illustrated with less than 50 lines of code. Here's a great article for some great tips on creating a reduced test case: https://css-tricks.com/reduced-test-cases/

 

We will be very happy to assist once you have a clean demo.

 

Thanks.

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

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. 


  • Recently Browsing   0 members

    No registered users viewing this page.

×