rcbyr / keen-slider

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

slideChanged event firing several times when looping is enabled #304

Open nick-elpedes opened 1 year ago

nick-elpedes commented 1 year ago

I had an issue where slideChanged would fire more than once when changing from my last slide to my first slide.

Besides enabling looping, all settings when initializing the slider are default. I added a hook into sliderChange to show what I am trying to describe.

// printing animator to show index of slide being pushed
slider.on("slideChanged", () => {
            console.log(slider.animator);
          });

Screenshot 2022-12-14 at 3 39 08 PM

In the screenshot above, I have a slider looping through 3 slides. When it switches from slide 3 to slide 1, it fires the slideChanged event 3 times instead of 1 time.

rcbyr commented 1 year ago

Hey @nick-elpedes

this behavior is correct. Here is an example how you could achieve what you want: https://codesandbox.io/s/relaxed-torvalds-bltizs?file=/src/App.js

nick-elpedes commented 1 year ago

Hey @nick-elpedes

this behavior is correct. Here is an example how you could achieve what you want: https://codesandbox.io/s/relaxed-torvalds-bltizs?file=/src/App.js

The code you linked still does not fire the event in a reliable way. Sometimes the event fires, sometimes it doesn't fire at all. I linked a video showing what I mean.

https://user-images.githubusercontent.com/107874690/208490229-1db98656-3a4a-43ee-8850-c9db67868d08.mp4

HarshArora-1205 commented 4 weeks ago

@nick-elpedes Did you find any solution? In my case slidechanged is fired twice on reaching initial side again.(in loop)