Jump to content
Search Community

scrolltrigger counters

gareth test
Moderator Tag

Recommended Posts

Hey gareth. Thanks for being a Club GreenSock member. 

 

If you wanted to keep your same setup, you just need to change your toggleActions:

toggleActions: "play reverse play reverse"

I would also recommend using a loop to create the tweens and ScrollTriggers. More on that in my article about animating efficiently

 

However since all of your sections have the same height I might use a different approach. I might set up a single timeline and then attach a single ScrollTrigger to it, scrubbing through the timeline as necessary. 

Link to comment
Share on other sites

thanks! I have updated my codepen to use your suggested toggleActions.

 

In my actual code all the sections are not the same height and less that 100vh so I have the problem that two sections are shown at once, how can I trigger it so the old section changes as the new section comes in, even if it still visible?

 

I have changed the first section to 50vh to show the problem

Link to comment
Share on other sites

You have to decide how you want to handle that as there's multiple ways you could handle it. Perhaps it would make sense to have the one that's currently in the middle of the viewport be active? Or maybe the one that has the largest percentage of its height on the screen? There are other ways you could do it as well.

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