Topic: Carousel pause for onclick events inside carousel does not work with gestures
ming priority asked 3 years ago
I want to make the carousel stop if the user clicks on certain buttons on the cards inside the carousel. It works fine on desktop, but not with mobile gestures.
To reproduce: the full-screen version of this snippet works on the desktop view regardless of screen size, but not with mobile gestures.
Another interesting behavior is that carousel pause works if the button is outside the carousel.
Marcin Luczak staff answered 3 years ago
Hi,
This is related to the carousel behavior inside the touch devices and the pause
option : Carousel options. By default pause
is set to hover
which for mobile devices after touchend event causes a carousel pause for 2 cycles and then resume. This behavior overwrites global pause, so when you click the button inside the card you globally pause the carousel, but also trigger default pause behavior for mobile devices.
To disable this auto resuming, please add data-pause="true"
to your carousel element.
Keep coding, Marcin
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Priority
- Premium support: Yes
- Technology: MDB jQuery
- MDB Version: MDB4 4.19.2
- Device: iPhone, iPad
- Browser: Chrome, Safari
- OS: iOS
- Provided sample code: No
- Provided link: Yes