Touch event stuck in carousel

[mattkaye]

I found what I think is a nasty bug. If you set your carousel to the fade effect, on a phone (or Google Chrome's dev tools phone simulator) you cannot scroll the page by swiping up or down over a carousel slide. The touch event seems to be captured by the slider and if the side is the whole width of the viewport, you're stuck.

Just to be sure it wasn't my code. I tried the slick carousel fade demo on Ken's page: https://kenwheeler.github.io/slick/

Then I tried the fade demo on this library's page: https://gs-shop.github.io/vue-slick-carousel/#/example/fade

I was only able to reproduce this issue using this library. So it has something to do with the way Ken's library is integrated into this Vue component.

Has anyone else seen this? Is there a fix? I'd rather not have to rewrite everything I've done but this is a blocker for me.

[mattkaye]

So no one is having this issue? I find that hard to believe. I'd love it if someone can look at this and verify that I'm not seeing things, cause I can reproduce it straight off the demo code.

[mattkaye]

Ok so I found the bug. It was dealt with in 2014 it seems, but it still seems to persist with this library: https://github.com/kenwheeler/slick/issues/3889

[alisspers]

I think I just ran in to the same thing. Setting touchMove: false allowed scrolling again but that disables swiping betweeen slides. I think the same bug causes https://github.com/gs-shop/vue-slick-carousel/issues/98.

There's a workaround posted in https://github.com/gs-shop/vue-slick-carousel/issues/98 which seems to be working, at least in my 2-minute testing on my iPhone:

        pointer-events: none;
        @media (hover: hover) {
            pointer-events: auto;
        }

[dewita]

Hey !

Still have the same issue here :/ The workaround is not working for the @mattkaye use case. I use an Android device but this is the same for an iPad or other touchable devices.

Unfortunately, it seems that the creators of this project are very busy and I hope that this will not be the end of the support of vue slick...

[mattkaye]

@dewita I ended up bailing on this and one other Vue implementation of the slider and just directly used Ken's library. It was just sucking up way too much time and the benefit of sticking with this outdated code was just not apparent. Maybe someone will fork this and bring it up to date at some point. I recommend moving on unless you have a strong reason that you have to use this library.

[dewita97]

Alright, thanks @mattkaye for your advice.

[laksmaria]

Facing a similar issue here with the vue router-link wrapped with text and image. However it does work when disable the touchMove in the config but that disables the swipe as @alisspers mentioned above.