Jump to content

Search In
  • More options...
Find results that contain...
Find results in...
Daniel Hult

Scrolltrigger overlapping pinned sections

Go to solution Solved by akapowl,

Recommended Posts

Hi guys,

Im trying to achieve the layered pin effect with scrolltrigger, similar to the demos here:

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

Im just trying to add one section in between that is pinned WITH pinSpacing enabled. After the animation is done on that pinned section, I want the next section to overlap that section just like these demos. Does that make sense?

In my codepen here, after the logo animation is finished, I want the section below to overlap the finished logo section, and then pin that section with pinspacing.


1. Animate logo/svg with normal pinSpacing
2. Once it is finished, the next section overlaps
3. When the overlapping section reaches the top of the viewport, it will be pinned with pinspacing

Is that possible? 😊

See the Pen a4a80da542d0baac8691f28aa911211e by daniel-hult (@daniel-hult) on CodePen

Link to comment
Share on other sites

  • Solution


Hey there @Daniel Hult


This recent thread asked about essentially the same thing.

Looks to me, like the solution from over there should be a good fit for you, too.


Give it a shot and let us know if it helps.






  • Like 2
Link to comment
Share on other sites

Ah, perfect! That solved my problem as well!
Thank you 😄

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