Как в Swiper сделать кастомную пагинацию, которая будет отображать кол-во слайдов на экране из общего колва слайдов?

Question

[Raym0NT]

Добрый день, как можно такое сделать?

Если делать базовый fraction из доки swiper, то будет считаться не все кол-во слайдов, а то сколько слайдов нужно проскролить еще.

Есть идеи, как это можно сделать? куда копать?

const swiper = new Swiper(".space-for-designers__slider", {
  slidesPerView: "auto",

  spaceBetween: 30,
  initialSlide: 0,

  navigation: {
    nextEl: ".space-for-designers__slider-arrow--next",
    prevEl: ".space-for-designers__slider-arrow--prev",
  },
  pagination: {
    el: ".space-for-designers__pagination",
    type: "fraction",
    renderFraction: (currentClass, totalClass) => {
      console.log(currentClass, totalClass);
      return `<span class="${currentClass}"></span> из <span class="${totalClass}"></span> Фото`;
    },
  },
});

Comments

[Вадим]

Копать в сторону поисковика. Как в гугл/яндекс, так и местного. Достаточно частый вопрос.

[Александр Васильев]

Ты сделаешь это, но потом придет вопрос - как при изменении размера экрана менять кол-во в счетчике ))