Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Swiper loop issue when set to slidesPerView: 3, loop: true, and centeredSlides: true when only having 4 slides #7325

Labels
t0ggles Linked to the t0ggles task

Comments

@jackkemmish
Copy link

Check that this is really a bug

  • I confirm

Reproduction link

https://codepen.io/jackkemm/pen/gOEyEKx

Bug description

I am wanting to loop a carousel when slides are more than 3, and whilst it loads okay, as soon as you resize the browser, the slides reshift and the prev slide disappears. This is true for when there are four slides for example, however when there are more than that it's okay.

I have cases where whilst slidesPerView is set to 3, I might have 4 slides but want to loop through them. I have tested by adding more and it then starts to work fine, but this is different to what it says in here Swiper back to basics - "minimum number of slides must be >= slidesPerView + slidesPerGroup"

In some cases i'd like to be able to loop through 3 slides when there are only 3 available slides too but that's another problem as I can't see no way in the docs to add in extra slides.

If I have slidesPerView set to 3, and have 4 slides, that fits within the boundaries?

Expected Behavior

I would expect by setting slidesPerView: 3 and having 4 slides for the looping functionality to work on resize.

Actual Behavior

Setting slidesPerView: 3 and having 4 slides for example, resizing the browser causes a shift in the slides to reorder and the prev slide disappears.

Swiper version

11.0.6

Platform/Target and Browser Versions

macOS - all browsers

Validations

  • Follow our Code of Conduct
  • Read the docs.
  • Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
  • Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

  • I'm willing to open a PR
@jackkemmish jackkemmish changed the title Swiper loop issue when set to slidesPerView: 3, loop: true, and centeredSlides: true when on;y having 4 slides Swiper loop issue when set to slidesPerView: 3, loop: true, and centeredSlides: true when only having 4 slides Feb 21, 2024
@nolimits4web
Copy link
Owner

t0ggles-create swiper

Copy link

t0ggles bot commented Mar 19, 2024

Task nolimits4web/SWIPER-76 was created

t0ggles task SWIPER-76

Copy link

t0ggles bot commented Mar 28, 2024

Task nolimits4web/SWIPER-76 status changed to Done

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment