Jump to content
GreenSock

jesper.landberg

adding tween to tl.reverse() ?

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, is it possible to add a tween to reverse() as the last step?

 

tl.reverse()

tl.add ... ? 

 

 

Link to comment
Share on other sites

It is possible but the behaviour might not be something desirable.

 

Maybe if you explain a bit more what exactly is you are planning or trying to achieve. Reduced case demos are always a sure way to help us help you ;)

 

See the Pen VKxmNz?editors=0010 by dipscom (@dipscom) on CodePen

  • Like 1
Link to comment
Share on other sites

It is possible but the behaviour might not be something desirable.

 

Maybe if you explain a bit more what exactly is you are planning or trying to achieve. Reduced case demos are always a sure way to help us help you ;)

 

See the Pen VKxmNz?editors=0010 by dipscom (@dipscom) on CodePen

 

It's two buttons, and when clicking one of them I want the reverse() animation to be slightly different, either by adding a tween to it or removing the last step.

Link to comment
Share on other sites

Well, Jesper, I am not much closer to understanding what you want to achieve.

 

There are many ways of achieving a slightly different animation one, would be to simply fire a call to a function at onReverse and have this function run a tween. Another would be a .call() in your timeline that returns different things depending which way your timeline is playing.

 

As you are triggering your reverse() from a click, you can also add the said tween before calling the reverse().

 

I'm just shooting in the dark here, to be honest. If you provide us a reduced case example, we can always tweak it with suggestions. Right now, it is hard to even guess what effect you are after.

  • Like 2
Link to comment
Share on other sites

Also, if you want to "remove the last step" you might be able to pass in a label to reverse like tl.reverse("beforeLastStep") and the playhead will jump to that label and then reverse.

 

I agree 100% with Dipscom. A simple demo with the animations and a few buttons in place will go a long way towards us understanding what you need and being able to help. What you are asking for can actually be a bit complicated and it isn't a good use of our time to guess at what you need. 

 

When an animation reverses it just plays backwards, If you want to modify it to play differently you will either have to add or remove tweens which you may need to add or remove again the next time you play forward. Technically anything is possible but most often it is easiest to just create a new timeline on each play and reverse instead of constantly adding and removing tweens. Again, without better understanding exactly how the animation needs to be different it is very difficult to offer a solution.

  • Like 2
Link to comment
Share on other sites

Carl, always with tips that I don't think of.

 

It's a great way to pick up some new tricks...

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