Jump to content
GreenSock

woodrow8

How to stop a tween and play another tween? Overwrite not working?

Go to solution Solved by woodrow8,

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

Hi everyone,

Here is what I'm expecting to happen in the Codepen:

 

1. Click the "Bezier" button to animate the red box along a bezier path

2. While that is playing, click the "Highlight" button. The bezier tween should stop and the red box should animate up to the top left corner of the green box.

3. Click the "Bezier" button again. The red box should then animate back to it's original starting position and then start on the bezier path again.

 

I thought setting overwrite:"all" would help accomplish this, but I can't get the "Highlight" button to work. If you click the "Highlight" button first then it does move the red box to the correct position, but it doesn't work if you click it second.

 

If you click the "Play Vertical" and "Play Horizontal" buttons, then the red box does box in the appropriate direction. Even if you click them in different orders, so the overwrite appears to be working there?

 

Any suggestions?

See the Pen mVWKYw by anon (@anon) on CodePen

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