FormidableLabs
Scroll disabled with swiping === false
Describe Your Environment
- What version of nuka-carousel are you using? 4.4.2
- What version of React are you using? 16.6.1
- What browser are you using? Chrome
- What machine are you on? Windows
Describe the Problem
https://codesandbox.io/s/mjxwl64p2y Just add swiping={false} into carousel props Then use chrome dev tools to simulate a mobile device (CTRL + SHIFT + M)
Expected behavior: [What you expect to happen] I expect the touch swiping to be disabled, and to be able to scroll the window while touching (vertically) on the slide. Actual behavior: [What actually happens] Swiping indeed is disabled, but sometimes (in codesandbox sometimes, in my code always for some reason) if you scroll using touch, when you start the scroll inside the slide, it will not scroll. Therefore if your slide is full-screen (like mine is), it can easily happen that you get stuck with no option of scrolling out of the slide.
Additional Information
Any additional information, configuration or data that might be necessary to reproduce the issue.
For now, I've hacked around this using
.slider-frame{
pointer-events: none;
}
Which obviously is far from ideal.
I have seen this issue as well on mobile Chrome, although not on mobile Safari.
We are experiencing a similar issue on touch devices. Our carousel takes up 90% of the vertical height so users are unable to scroll the page. @PeterKottas's solution works but we agree that this is not ideal.
Hi there! I also encountered this bug, switching off pointer-events on the slider is a good idea for most cases, but if you have interactive UI elements(especially with OnClick handlers) inside slider content it is not a good solution.
The below solution is good until you have radio button inside the slide. with radio inside card will block radio selection.
.slider-frame{ pointer-events: none; }
