Использую Swiper слайдер, и возникла необходимость сделать не ограниченное количество слайдеров на одной странице. Все работает но вот не задача инициализация делается вот так:
$('.sw-product').each(function(){
var swiper = new Swiper(this, {
lazyLoading: true,
pagination: {
el: '.slidernav',
clickable: true,
bulletClass: 'roundbtn',
bulletActiveClass: 'active',
renderBullet: function (index, className) {
return '<button class=" ' + className + '"></button>';
},
},
});
});
Естественно, когда я нажимаю на любую кнопку пагинации перелистывания слайда например swiper-pagination-bullets, у меня перелистываются все слайдеры сразу. Проблема в том, что если выводить неограниченное количество слайдеров, придется в каждом слайдере писать свой класс, и несколько раз дублировать js.
А это не хорошо.
Как можно поступить в этом случае?