Jump to content
Search Community

ScrollTrigger and Timeline "reversal" problem

OrganicBlue test
Moderator Tag

Go to solution Solved by Rodrigo,

Recommended Posts

Hello everyone.

 

I think the code explains what I'm trying to do, but just in case...

 

I have a timeline attached to the scroll with several animations in which certain elements "appear" from above, and then those same elements should disappear in the same way, but they don't move, they just disappear.

 

Also, when going back to the top, the animation of those elements is wrong.

 

Thank you for your help.

See the Pen BaPVqYM by Satelier-Diego (@Satelier-Diego) on CodePen

Link to comment
Share on other sites

  • Solution

Hi,

 

In these cases is better to just use a set instance before creating the animations in the timeline, because you're getting into issues with the initial state the elements have when the timeline is first rendered. Instead of going too deep into the rabbit's hole is better to just use to() instances and a few set ones up front:

See the Pen PoBdOzX by GreenSock (@GreenSock) on CodePen

 

Happy Tweening!

Link to comment
Share on other sites

16 hours ago, OrganicBlue said:

Can this be solved with immediateRender, or is better by just setting the initial state?

That kind of opens a new can of worms hence this comment:

17 hours ago, Rodrigo said:

Instead of going too deep into the rabbit's hole is better to just use to() instances and a few set ones up front

 

16 hours ago, OrganicBlue said:

Can an animation be triggered (such as the animation of the first dots) but not linked to the scroll, in this scenario?

Sure thing just remove that animation from the timeline, create a new one (after creating the timeline, order is super important to prevent issues) and either use toggleActions or the event callbacks ScrollTrigger has built in.

 

If you have more questions let us know and remember to include a minimal demo.

Happy Tweening!

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