Swiper slider slowdown after load new loop

571 views Asked by At

i have a little problem. I made a slider that plays photos with the coverflow effect in a loop. The problem is that when loading a new loop, the first time after all 8 slides, then after every 4, there is a slowdown. How to eliminate or remove it?

var mySwiper = new Swiper('.cakeSwiper', {
  effect: 'coverflow',
  loop:true,
  // loopPreventsSlide: false,
  // loopPreventsSliding: false,
  // loopedSlides: 2,
  autoplay: {
    delay: 1,
    disableOnInteraction: false,
    // waitForTransition: 0 // set "wait for transition" time to 0,
  },
  coverflowEffect: {
    rotate: 50,
    stretch: 0,
    depth: 100,
    modifier: 1,
    slideShadows: true,
  },
  slidesPerView: "auto", // show every slide at the start
  // centeredSlides: true, // center the active slide
  // initialSlide: 0, // start on the first slide
  speed: 1000,
});

In scss i added webkit fx to linear transition but still it doesnt work

.cakeSwiper {
    width: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    
      .swiper-wrapper {
        -webkit-transition-timing-function:linear!important; 
        -o-transition-timing-function:linear!important;
        transition-timing-function:linear!important;
        // transition-timing-function : linear;

        .swiper-slide {
            background-position: center;
            background-size: cover;
            width: 300px !important;
            height: 300px;  
    
            .swiper-slide img {
              display: block;
              width: 100%;
              height: auto;
            }
          }
      }
  }

Here is video to see how it 'works' https://www.veed.io/view/09bc20b2-8f10-4ec7-b8ee-04b2e443b995?panel=share

I used chat but he dont understand me. I looked for some answers on stack but i didnt found. Also swiper documentanion doesnt include any answer.

0

There are 0 answers