Emiliano-Bucci/react-spring-carousel-js

Specify touch-action css property when using useSpringCarousel

Mayowa-Ojo opened this issue · 3 comments

Mayowa-Ojo commented

I ran into some issue with the scrolling behaviour on touch devices and I couldn't figure out why it wasn't working until I went to the react-use-gesture docs. They require that you specify the touch-action css property on the draggable component (set it to none) to avoid unexpected behaviour.

I think you should also specify that in the docs for react-spring-carousel-js also, because it can easily throw users who aren't familiar with react-use-gesture off.

Emiliano-Bucci commented

@Mayowa-Ojo Hi! Yes, you're totally right about that! I'll try to update the docs asap :)

flndr commented

When using the carousel with horizontal axis then touch-action : pan-y; on the parent element might be a good choice. This way you can still control the carousel AND scroll the entire page up and down when you drag or flick on the carousel (or the parent element to be exact). Works great for me (with v1.9.25). ;)

  • 👍2