rcbyr / keen-slider

The HTML touch slider carousel with the most native feeling you will get.
https://keen-slider.io/
MIT License
4.57k stars 210 forks source link

Vertical auto-switch unexpected behavior after several seconds #398

Open devinekadeni opened 5 months ago

devinekadeni commented 5 months ago

Version

initially facing this issue on version 6.6.14 reproducible on codesandbox on version 6.8.5

Reproduce Codesandbox

https://codesandbox.io/p/sandbox/keen-slider-vertical-auto-switch-anomaly-mcw8nt

Issue Description

When working with vertical mode and implementing auto-switch mechanism using setTimeout and slider.next, at first it was working fine, but after a while (in seconds), it becomes unexpected. I notice that this issue happens when I added spacing property. If I remove it, it will work just fine.

Please look at video below to get more understanding (the unexpected behavior happens on time 0:18 in the video)

https://github.com/rcbyr/keen-slider/assets/29223530/b04be266-2c0c-482d-a788-46b18cecb7ef

This is main usage of the useKeenSlider

useKeenSlider<HTMLDivElement>({
    loop: true,
    slides: {
      origin: "center",
      perView: 1,
      spacing: 10,
    },
    vertical: true,
    created: (slider) => {
      setTimeout(() => {
        slider.next();
      }, 500);
    },
    animationEnded: (slider) => {
      setTimeout(() => {
        slider.next();
      }, 500);
    },
  })
devinekadeni commented 5 months ago

currently can be solved by passing additional plugin mentioned on this issue. But I hope this can be fixed internally on the package