Skip to content
This repository has been archived by the owner on Mar 6, 2022. It is now read-only.

Specify touch-action css property when using useSpringCarousel #11

Closed
Mayowa-Ojo opened this issue Jun 19, 2021 · 3 comments
Closed

Specify touch-action css property when using useSpringCarousel #11

Mayowa-Ojo opened this issue Jun 19, 2021 · 3 comments

Comments

@Mayowa-Ojo
Copy link

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
Copy link
Owner

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

@flndr
Copy link

flndr commented Sep 12, 2021

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). ;)

@Emiliano-Bucci
Copy link
Owner

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants