SwiperJS Pagination only updating at first and last dot but not in between

Viewed 239

I'm using SwiperJS in my project and i tried to create a swiper with a pagination. Everything is working expect when Swiping the Pagination Dots arent updating correctly. Only when reaching the first or the last slide it will update. But clicking on the dots works.

My Swiper Configuration:

releasesSwiper = new Swiper('.swiper.next-releases', {
 // Optional parameters
 slidesPerView: 6,
 spaceBetween: 20,
 direction: 'horizontal',
 loop: false,
 initialSlide: 0,
 centeredSlides:false,
 createElements: false,
 effect: 'slide',
 roundLengths: true,
 autoplay: false,
 cache: false,

 // If we need pagination
 pagination: {
   el: '.section-content.next-releases .swiper-pagination',
   clickable: true,
 },
});

plus my HTML:

<div class="swiper section-content next-releases hidden">
  <!-- Additional required wrapper -->
  <div class="swiper-wrapper section-content-wrapper">
                        
  </div>
  <div class="swiper-pagination"></div>
</div>

I already tried calling the swiper.pagination.update function manually after swiping but that didn't work either.

I also have another Swiper on the same site that works so i dont know why this one should not.

I'm using the latest version of SwiperJS.

1 Answers

The answer to this was relatively simple: The initialization of the swiper class was in a for loop and caused problems because of it.

Related