Подскажите, пожалуйста, как исправить мой код, чтобы он считал не количество слайдов, а количество страниц со слайдами. Буду благодарен любому ответу.
//инициализация слайдера
const swiper__products = new Swiper('.choice__slider', {
slidesPerView: 1,
slidesPerGroup: 1,
spaceBetween: 72,
pagination: {
el: '.aside__progressbar',
type: 'progressbar'
},
breakpoints: {
767: {
slidesPerView: 2,
slidesPerGroup: 2,
},
1200: {
slidesPerView: 3,
slidesPerGroup: 3,
},
} });
//добавляем 0 перед цифрой
function formatFraction (number) {
if (number < 10) {
number = '0' + number;
}
return number;
};
// код счетчика слайдов
let mySliderAllSlides = document.querySelector('.aside__total')
let mySliderCurrentSlide = document.querySelector('.aside__current');
mySliderAllSlides.innerHTML = formatFraction(swiper__products.slides.length);
swiper__products.on('slideChange', function() {
let currentSlide = formatFraction(swiper__products.realIndex + 1);
mySliderCurrentSlide.innerHTML = currentSlide;
});
<script src="https://unpkg.com/swiper@7/swiper-bundle.min.js"></script>
<link
rel="stylesheet"
href="https://unpkg.com/swiper@7/swiper-bundle.min.css"
/>
<div class="choice__slider">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
<div class="swiper-slide">Slide 4</div>
<div class="swiper-slide">Slide 5</div>
<div class="swiper-slide">Slide 6</div>
<div class="swiper-slide">Slide 7</div>
<div class="swiper-slide">Slide 8</div>
<div class="swiper-slide">Slide 9</div>
</div>
<div class="aside__counter">
<div class="aside__current">01</div>
<div class="aside__total">05</div>
</div>
<div class="aside__progressbar"></div>
</div>