CODEWITHSUNDEEP
cssioswordpresselementorslick.js
nizoom
nizoom

Reputation: 115

Slick slider prevents vertical scroll

I'm having trouble pinpointing the culprit / resolving this issue of slick carousels preventing vertical scrolling on mobile. You can't scroll vertically until the carousel moves one slide. There a few across the site on both the services and home page and so the issue is popping up a lot.

Chrome dev tools does not pick up on this issue but when loading the page on Simulator or a iOS device then the scrolling issue arises.

This is a common issue with Slick Slider It seems like others have resolved this issue by applying

pointer-event: none

or

touch-action: auto !important;
-ms-touch-action: auto !important;

The issue with pointer-event: none is that some of the slides have buttons which become inactive with that property. I've tried adding the following to apply the touch-action rule:

```
.slick-slider,
.slick-track,
.swiper-slide,
.swiper-slide-active,
.slick-wrap,
.slick-project,
.js-slick-wrapper {
    touch-action: auto !important;
    -ms-touch-action: auto !important;
}
```

Here is the site:

https://lmrinteriors.wpcomstaging.com/

Thank you very much for any help.

Upvotes: 0

Views: 892

Answers (0)

Related Questions