Jump to content

Alex M

Snapping to a section with scrollTo and scrolTtrigger

Go to solution Solved by GreenSock,

Recommended Posts

Hi folks, 

I'd like to control the scroll behavior by forcing it to scroll to the next section. I've tried to follow this example 

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

 but my pen isn't working. It is stuck to the first section. Do you have any idea why that's happening?


Here is my demo: 


Thanks in advance

See the Pen LYBNovZ by maqquo91 (@maqquo91) on CodePen

Link to comment
Share on other sites

  • Solution

The main problem is a logic one - you're first section actually starts a little more than 100vh from the top, but you've got things set up based on the index so that the first section scrolls to 0 (very top). But you actually want it to scroll to that first section which is a little more than 100vh from the top. 


Here's a fork where I tap into the ScrollTriggers' "start" value for the positioning: 

See the Pen YzjWzgv?editors=0010 by GreenSock (@GreenSock) on CodePen


Is that more like what you wanted?

  • Like 1
Link to comment
Share on other sites

Thanks a lot, Jack, that is exactly what I wanted to achieve.  


And happy new year. 

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