Jump to content
GreenSock

PixeledCode

Align scrollTrigger end with the start of next trigger on same id

Go to solution Solved by Cassie,

Recommended Posts

Hi,

I'm trying to create a scrolltrigger where I can only target the heading of before a paragraph. On each trigger, I am supposed to add class to some other element. but currently, since I am only targeting h3 tags, scrolltrigger ends just as soon as it starts, as you can see in demo. Since all the trigger belong to same id, I was hoping if there was some way to align end of each trigger just before the start of next one?

 

Thank You

See the Pen VwbXGrE by PixeledCode (@PixeledCode) on CodePen

Link to comment
Share on other sites

  • Solution
22 minutes ago, PixeledCode said:

On each trigger, I am supposed to add class to some other element. but currently, since I am only targeting h3 tags, scrolltrigger ends just as soon as it starts, as you can see in demo

This shouldn't be an issue, there's plenty of time to add a class to a different element, you can use the onToggle callback to run some custom logic.

If you still want to space them out, you can use start and end positions to move the markers - You could also use different start and end triggers?

Something like this?

See the Pen 72af9d8cddc65f99a8e25b3e2be4d7c7?editors=1011 by cassie-codes (@cassie-codes) on CodePen

  • Thanks 1
Link to comment
Share on other sites

32 minutes ago, Cassie said:

This shouldn't be an issue, there's plenty of time to add a class to a different element, you can use the onToggle callback to run some custom logic.

If you still want to space them out, you can use start and end positions to move the markers - You could also use different start and end triggers?

Something like this?
 

 

Thanks Cassie, that's exactly what I was looking for. I should definitely go through Carl's GSAP course again haha

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