swiper
swiper copied to clipboard
Back button doesn't work properly when using loop, slidesPerView and slidesPerGroup
This is a (multiple allowed):
-
[x] bug
-
[ ] enhancement
-
[ ] feature-discussion (RFC)
-
Swiper Version: 4.4.2
-
Platform/Target and Browser Versions: Windows (all major browsers)
-
Live Link or JSFiddle/Codepen or website with isssue: https://codepen.io/anon/pen/pQRLEr
What you did
I hit the back arrow multiple times, with the config you can see in the codepen.
Expected Behavior
The back arrow should change between the groups ( Group 1, Group 2, Group 1, ...)
Actual Behavior
The back arrow always shows group 2 (Slide 3, 4, 5) ( Group 2, Group 2, Group 2, ...)
Same issue for me, with loop and any combinaison of slidesPerView and slidesPerGroup, when slidesPerGroup > 1.
Going backward seems to be bugged.
Items are not displayed as expected.
I have the same issue with the newest version of swiper (4.5.0) . It seems that the problem appears when you try to go to previous group of slides when on the last view with even number of slides and below settings:
slidesPerView: 3,
slidesPerGroup: 3,
loop: true,
Codepen:
https://codepen.io/tmittlener/pen/BeOqBK
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
Please do not close this issue. This bug still exists with 5.2.0
Is there any update on this issue?
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
This bug still exists in 6.2.0 I updated the codepen
updated demo to the latest version: https://codesandbox.io/s/ecstatic-browser-4ofod?file=/index.html
It happens when execute slideTo function in loop/loopFix.js. As far as I know, the purpose of execute slideTo when activeIndex < loopedSlides is to reset the track position from duplicate slide to real slide position.
But when total slides cannot divide by slidePerGroups, it will snap to wrong slide , and then it will slide one more time after execute loopFix() in slide/slidePrev.js.
For example, in the situation @vltansky provideed, that is,
if slidePerViewand slidePerGroup are set to 3, loop: true and suppose there are total 10 slides, the dom will look like:
s8 s9 s10 | s1 s2 s3 | s4 s5 s6 | s7 s8 s9 | s10 | s1 s2 s3, the begging and end group are duplicated slides for loop usage.
when you start at slide 1, 2, 3 ,you click prev then go to duplicated slide 8, 9, 10, then click prev one more time, it will execute loopFix, but it will first snap to slide |s7 s8, s9| group, not |s8 s9 s10|, and after loopfix, it will continue to slide to prev group.
So you start at |s8 s9 s10| but after click prev button one time, swiper will go to |s4 s5 s6|, the bug happens
Bug still exists in 8.2.4
Code pen: https://codepen.io/deifro/pen/eYVoOoY - duplicate swiper slides are in a different colour
Bug still exists in 8.2.4
Code pen: https://codepen.io/deifro/pen/eYVoOoY - duplicate swiper slides are in a different colour
facing same issue so any solution ?
Bug still exists in 8.2.4 Code pen: https://codepen.io/deifro/pen/eYVoOoY - duplicate swiper slides are in a different colour
facing same issue so any solution ?
Unfortunately no
Swiper v9 comes with fully reworked and now different loop functionality. If you have similar issues in Swiper 9, open a new issue with a CodeSandbox showing the issue.