Horizontal section. How make slides scroll easier?

[jimmy-a 10 Likes (Newbie)]

Hello there!

 

I'm trying to create an horizontal scrollable section inside this mainly-vertical scroll site, which works fine so far, but now I need help to make the slides move easier when scrolling. What I mean is, right now you need to scroll almost the full width size of the current slide in order to go to next or prev slide, but I want to make the slides go/move/snap forth and back with less scrolling time, using either a mouse or a trackpad. I tried different snap values without the desired result.

 

I don't know for sure if the approach made in my Codepen is the right one, it's the same as in this official example:

 

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

 

Thanks again for this support space

See the Pen jOWaZZV by jimmyadaro (@jimmyadaro) on CodePen

Edited July 1, 2020 by jimmy-a
Fix official Codepen embed

[ZachSaucier 7,132 Likes (Superhero)]

Hey Jimmy. Just change the end value. If you want it to be twice as fast then divide it by 2:

end: () => "+=" + (document.querySelector(".container").offsetWidth / 2)

 

[jimmy-a 10 Likes (Newbie)]

19 minutes ago, ZachSaucier said:

Hey Jimmy. Just change the end value. If you want it to be twice as fast then divide it by 2:

end: () => "+=" + (document.querySelector(".container").offsetWidth / 2)

 

 

Awesome! Didn't think about that. I divide it by 8 in my real project and works like a charm. 

 

Thanks again 🙌