question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Carousel advances once extra after swipe, with autoplay = false

See original GitHub issue

This is a known issue with a pull request and a closed bug report, but since the issue still appears to be present in the latest version of this package on npm, I thought it could do with a new open bug report highlighting it.

Bug summary: when you install the latest version and create a carousel with autoplay={false}, then swipe either direction, after about 3 seconds the carousel will advance one slide of its own accord, as long as it isn’t already on the last slide of course.

The issue of these ‘ghost swipes’ appeared to be related to autoplay being initialised after a swipe, regardless of the state of the autoplay prop, and the PR looked like it remedied the issue. However, the issue persists as of version 3.2.19. It is worth noting that a fork by SUCHiDEV of react-responsive-carousel and published as npm package react-responsive-carousel-2 appears to have the issue fixed. That is the package I am currently using, but I would like to get back to using the original package if possible.

EDIT: I am not using the react-responsive-carousel-2 package, because it has other bugs which have since been fixed in the main version, and instead I am using the temporary fix suggested by jonaschan, which is to set the [autoplay] interval prop to a very large number of ms).

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:4
  • Comments:13 (3 by maintainers)

github_iconTop GitHub Comments

7reactions
milessorcecommented, Jul 16, 2021

I’m also experiencing this issue. As a temporary workaround, I am setting interval to 9999999.

2reactions
its-natecommented, Aug 18, 2021

@finnmerlett my fix for this was just merged into the latest release, 3.2.21, so you can come back to the original package if you like and can close this issue 👍

Read more comments on GitHub >

github_iconTop Results From Across the Web

Bootstrap carousel multiple frames at once - Stack Overflow
Another option is a responsive carousel that only shows and advances 1 slide on smaller screens, but shows multiple slides are larger screens. ......
Read more >
slick - the last carousel you'll ever need - Ken Wheeler
slick is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping & much more!
Read more >
The Swipeable Gallery component - Google Web Designer Help
The Swipeable Gallery component lets you create a simple gallery that users can swipe forward and backwards to show either a set of...
Read more >
Image Carousels and Sliders: Why You Shouldn't Use Them ...
Repeat after me: "Image sliders and carousels kill conversions. ... To their credit, once you touch the slider arrows, the automatic rotation stops....
Read more >
Flickity · Options
Auto-playing will pause when the user hovers over the carousel. Set pauseAutoPlayOnHover: false to disable this behavior. autoPlay: 1500, pauseAutoPlayOnHover: ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found