[fix] https://github.com/kenwheeler/slick/issues/1252

[marcelombc]

Description

This PR fixes the problem of carousel sliding while drag-scrolling vertically on a touch device.
When the user scroll down and then swipe to the left or the right, the carousel swipes to left and right while scrolling which is quite annoying.
It's possible to see a video of the problem here and you can find the github issue here

Demo

Without the fix
With the fix

Note

You need to test these demos on touch devices

Credits

All the credits goes to @levymetal. Thank you for the code to fix this issue.

[simeydotme]

I haven't tried this, sorry I'm not able to do a full review... however, just looking at the commited changes it seems logical... but throwing a question out there:

Would this kill vertical carousels ?

[marcelombc]

That's a good point @simeydotme. I had a small issue with that but is already fixed and the vertical and horizontal carousel is working has expected. Sorry for not test that scenario.

[semenets]

I had the same problem today. When this PR will be ready for merge? :)

[bbodien]

Would also ❤️ to see this merged.

[dangelion]

@kenwheeler please merge this. Thanks

[kenwheeler]

@leggomuhgreggo can you verify this is all good?

[leggomuhgreggo]

@kenwheeler happy to -- I'll holler at it this evening.

[leggomuhgreggo]

Apologies for the long delay. This passes all my testing, nice work @marcelombc

In answer to @simeydotme's vertical mode question, I checked and vertical mode doesn't currently support touch swipe (at least on my phone), and, in any case, vertical mode has only ever been partially supported; so we're good here I'd say.

Merging. Thanks everyone!

[FullstackJack]

Both examples are janky on Android. It seems that the fixed version prevents side to side scroll as well if you swipe too frequently.

[leggomuhgreggo]

@FullstackJack can you elaborate on what you're seeing? I think a slide transition has to finish, before a new one will register; so, I wonder if that's what's goin on.

[yanwsh]

This fix make swap very difficult on mobile device, you have to make exact horizontal swap, otherwise it won't work, this is poor user experience. Hope it can provide an option let user setup vertical swap length compare value. Right now it's fixed number which is 4. I think it's better to be like 15.

 if (!_.options.verticalSwiping && !_.swiping && verticalSwipeLength > 4) {
   _.scrolling = true;
   return false;
 }

[rssteffey]

I have to second what @yanwsh said above. This fix has made scrolling a fullscreen div incredibly frustrating. (On an iPhone X, at least). Are there any plans to add a tolerance threshold to this limitation?

[gstoyanov]

I can confirm the problem @yanwsh mentioned above. Found an open issue about it as well: #3464