Swiper slider pagination dynamic
Lượt xem: 2569
Xem demo
Swiper slider pagination dynamic
Tương tự như phần pagination chúng ta cần bổ sung thêm class swiper-pagination trong class swiper-container như sau:
<!-- Swiper -->
<div class="swiper-container">
<div class="swiper-wrapper">
...
</div>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination"></div>
</div>
Tiếp trong phần khởi tạo Swiper ta vẫn thêm tùy chọn pagination tuy nhiên trong tùy chọn pagination ta bổ sung thêm thuộc tính dynamicBullets: true
<!-- Initialize Swiper -->
<script>
var swiper = new Swiper('.swiper-container', {
pagination: {
el: '.swiper-pagination',
dynamicBullets: true,
},
});
</script>
Xem demo