Prevent scrolling past snap? (And other snap behavior)

[Thisjustin 0 Likes (Newbie)]

Hello,

 

I'm trying to animate a slideshow using ScrollTrigger & scrub. I have snap set up and it works ok, but if you scroll with too much momentum you'll blow right past a slide/snap point. Is there a way too make the snaps mandatory? I don't think I can use CSS as the slides are absolutely positioned on top of one another.

 

Also with less momentum the snap animation seems to take a very long time to start. I would like the snap to happen at roughly the same speed regardless of momentum, is that possible?

 

Apologies if this has been covered somewhere else, I did my best to read the docs and search the forum.

See the Pen XWYqGOg by Thisjustin3141 (@Thisjustin3141) on CodePen

[GreenSock 18,229 Likes (Superhero)]

It sounds like you're looking for what Observer can provide: 

https://greensock.com/docs/v3/Plugins/Observer

 

Here's a demo: 

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

 

The whole point is that you can't really base it on "real" scroll position because that'll cause logic problems. As a user, if I see the scrollbar on the side and I grab it an go all the way to the bottom or if I wheel really fast, it will be VERY annoying if the browser forces it to come to a sudden halt or yanks it from under my pointer as I'm dragging it down, you know? So you have to approach it in a very different way that's more event/gesture driven and not true scrolling. 

 

I hope that helps!