Swiper: Slide disappear when using loop and centeredSlides

[cristianfierro]

Hi,

I'm having a problem when using swiper with centeredSlides and loop. I have a slider with 3 slides. I click the next button twice to go to the third slide and then click the previous button to go back to the second slide, and the previous slide (the first one) from the actual active slide disappears, is like the loop brokes for some reason and the duplicated slide is not visible since in the html the duplicated slides exists

Here is my code:

mainSliderSwiper = new Swiper('.main-slider .swiper-container',{
      slidesPerView: 'auto',
      centeredSlides: true,
      speed: 600,
      loop: true,
      loopedSlides: 2,
      pagination: '.pagination',
      paginationClickable: true,
      cssWidthAndHeight: true,
      initialSlide: 0
    });
    $('.main-slider .swiper-controls .swiper-prev-area').on('click',function(){
      mainSliderSwiper.swipePrev();
    });
    $('.main-slider .swiper-controls .swiper-next-area').on('click',function(){
      mainSliderSwiper.swipeNext();
    });
  }

The captures from firbug of the html:

Initial State

After clicking next once (second slide centered):

After clicking next twice (third slide centered):

After clicking previous once to return to second slide ( second slide centered and first slide disappears):

[nolimits4web]

As you may know, slidesPerView:'auto' is not really compatible with Loop mode. Try to increase loopedSlides and loopAdditionalSlides parameters

[clemorphy]

Hi

I had the same problem with these options : centeredSlides, loop, and slidesPerView 3. At a certain moment of the loop, when going backwards, an item was missing at the left, but was here again on the following click.

Thanks to your answer, I now understand better how the slider is working, and how useful is the 'loopAdditionalSlides' option to fix this.

Thank you for your awesome work.

[daniellucindo]

thank you :+1:

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.