swiper icon indicating copy to clipboard operation
swiper copied to clipboard

Back button doesn't work properly when using loop, slidesPerView and slidesPerGroup

Open apriljunge opened this issue 7 years ago • 10 comments

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, ...)

apriljunge avatar Nov 13 '18 16:11 apriljunge

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.

AgamlaRage avatar Feb 07 '19 17:02 AgamlaRage

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

tomaszmittlener avatar May 29 '19 14:05 tomaszmittlener

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.

stale[bot] avatar Nov 25 '19 14:11 stale[bot]

Please do not close this issue. This bug still exists with 5.2.0

apriljunge avatar Nov 26 '19 10:11 apriljunge

Is there any update on this issue?

tom-schneider-aw avatar Mar 16 '20 14:03 tom-schneider-aw

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.

stale[bot] avatar Sep 12 '20 14:09 stale[bot]

This bug still exists in 6.2.0 I updated the codepen

apriljunge avatar Sep 13 '20 11:09 apriljunge

updated demo to the latest version: https://codesandbox.io/s/ecstatic-browser-4ofod?file=/index.html

vltansky avatar Jan 24 '21 08:01 vltansky

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

johnson0903 avatar Sep 01 '21 15:09 johnson0903

Bug still exists in 8.2.4

Code pen: https://codepen.io/deifro/pen/eYVoOoY - duplicate swiper slides are in a different colour

deifro avatar Jun 22 '22 10:06 deifro

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 ?

manpreet-02 avatar Nov 22 '22 08:11 manpreet-02

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

deifro avatar Nov 22 '22 09:11 deifro

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.

nolimits4web avatar Feb 01 '23 11:02 nolimits4web