Судя по вашему описанию проблемы, кажется, что логика работы пагинации в вашем слайдере Swiper неправильно синхронизирована с количеством отображаемых слайдов. Swiper ожидает, что каждый буллет будет соответствовать одному слайду, и когда вы ограничиваете их количество, нужно учитывать и это.
Для корректной работы пагинации с ограничением по видимым слайдам, вам нужно будет настроить свойства слайдера и логику отображения буллетов.
Вот несколько шагов, которые могут помочь исправить вашу проблему:
1. **Проверьте настройки `pagination`**: Вам нужно убедиться, что вы правильно указываете `pagination` и его функции. Если у вас ограничение на 3 текущих активных слайда, вы также должны правильно настроить свойство `pagination`.
2. **Свойство `pagination`**:
Убедитесь, что вы добавили `clickable: true` и возможно рассмотрите использование `bullets` в зависимости от текущего индекса слайда.
3. **Обновление пагинации**:
Убедитесь, что установленное количество видно слайдов влияет на количество отображаемых буллетов. Для этого вы можете использовать параметры `loop` и `loopedSlides` (если вы используете зацикливание), чтобы следить за порядком слайдов.
Пример правильной инициализации Swiper:
```javascript
new Swiper(".partners-logo__slider", {
modules: [Navigation, Pagination],
observer: true,
observeParents: true,
slidesPerView: 3,
spaceBetween: 25,
speed: 800,
loop: true, // Включаем зацикливание
pagination: {
el: ".swiper-pagination",
clickable: true,
renderBullet: function (index, className) {
return `<span class="${className}"></span>`;
},
},
on: {
slideChange: function () {
const activeIndex = this.activeIndex;
const totalSlides = this.slides.length;
const bullets = document.querySelectorAll('.swiper-pagination-bullet');
// Обновляем состояние буллетов в зависимости от текущего активного слайда
bullets.forEach((bullet, idx) => {
bullet.classList.remove('swiper-pagination-bullet-active');
if (idx === (activeIndex % totalSlides)) {
bullet.classList.add('swiper-pagination-bullet-active');
}
});
},
},
});
```
### Основные моменты
- Проверьте использование свойства `loop`: оно позволяет вам зацикливать слайды, что может изменить поведение переключения буллетов.
- Используйте метод `on.slideChange` для дополнительной логики обновления состояния буллетов.
- Убедитесь, что в вашей функции рендеринга буллетов вы правильно задаете содержание и классы для активного состояния.
Вы можете также рассмотреть возможность добавить дополнительные индивидуальные стили к активному буллету, чтобы их поведение было более заметным.
Попробуйте эти изменения и убедитесь, что ссылка на видео помогает в идентификации проблемы, если что-то не работает так, как вы ожидали.