[Horizontal scroll snap at the end of a section]

On 9/30/2023 at 9:34 AM, GreenSock said:

Oh, so you just want to do snapping if it gets close to the very beginning or the very end? That should be pretty easy: 

 

 

 

Just use a function-based value. In the demo above, I let it get within 10% of the start/end before snapping (0.1). 

 

Is that what you wanted? 

 

Well, It's not exactly that. The behavior in the example that I provided works perfectly on sections whose width is equal to or less than 100vw, however when it is greater, as for the "Part Two" section, the snap is triggered from the start of the scroll, preventing the reading of its contents as a whole...
Generally speaking, the snap must be triggered when the right edge of the current section appears on the screen; Here is a screenshot to illustrate all this:

[Horizontal scroll snap at the end of a section]

11 hours ago, GreenSock said:

Hi @VéGé. I don't understand the question - it looks like it's snapping exactly as expected, including at the start and end. What am I missing? 

 

Hello @GreenSock and thanks for your response. 

 

In fact, snapping is triggered from the moment you start scrolling the section, which prevents the content from being read as a whole. The desired behavior is that we can scroll inside the section, and that snapping is triggered only when we reach the end of the section, in case the section is larger than 100vw.

[Horizontal scroll snap at the end of a section]

Hello,

 

I'm trying to set up an horizontal scroll snap with some sections width over than 100vw. But I can't figure out how to trigger the snap when reaching the end of my section (or beginning of the next one).

 

Help would be really appreciated

See the Pen QWzxpoG by valentin-guillot (@valentin-guillot) on CodePen

[Horizontal scroll snap with different widths]

Hi Rodrigo, and thanks a lot for your quick answer !

 

Worked perfectly   Now I need to figure out how to set the snap on the end of each section and it will go nice. 

 

Thanks again !

[Horizontal scroll snap with different widths]

Hello everyone, and thanks for all the help you already provided to me.

 

This is my first post on the forum, cause it's also the first time I don't find any solution to my issue here

 

So basically I would like to create an horizontal scroll snap, with most of my panels in 100vw, and some of them more. Is there a way to do that ?

 

Thank you for your response(s)

See the Pen vYvpaVq by ValentinAZKO (@ValentinAZKO) on CodePen