Jump to content
Search Community

Snapping skipping element when visible

Guest
Moderator Tag

Go to solution Solved by mvaneijgen,

Recommended Posts

Hey guys,

 

I have this codepen from previous topics that I liked the design of, and wanted to implement it. However, there is no snapping between articles.

 

I tried putting snap = [0, 0.1, 0.2, 0.3, ...., 1] but that didn't help at all, I am a total novice with GSAP and any guidance on how to do proper snapping would be appreciated.

See the Pen eYZpoXa by flowgrow (@flowgrow) on CodePen

Link to comment
Share on other sites

  • Solution

I didn't get why there where two ScrollTriggers  in your demo, so I removed one and combined the logic to just one. In your timeline I've .add(`label${I}`) which adds a label to a point on the time line and if I'm correct this is the place to which you want to snap. After that it was just a question of adding `snap: "labels"` to the ScrollTrigger object and now it will snap to those labels. There are a lot more settings within snap, but you can check the docs for that

 

See the Pen WNMwoMr?editors=0010 by mvaneijgen (@mvaneijgen) on CodePen

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