自定义移动端swiper无缝轮播分页器

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.3.5/css/swiper.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.3.5/js/swiper.min.js"></script>

<div class="swiper-container s2">

<div class="swiper-wrapper">

<div class="swiper-slide"><img src="" /></div>

<div class="swiper-slide"><img src="" /></div>

<div class="swiper-slide"><img src="" /></div>

<div class="swiper-slide"><img src="" /></div>

</div>

<div class="swiper-pagination"></div>

</div>

var sarr = ['第一屏','第二屏','三屏了','哇，四屏','第五个分页器'];

var mySwiper2 = new Swiper('.s2', {

pagination: {

        el: '.swiper-pagination',

        clickable: true,

        renderBullet: function (index, className) {

          return '<span class="' + className + '">' + (sarr[index]) + '</span>';

        },

      },

autoplay: {

delay: 3000,

stopOnLastSlide: false,

disableOnInteraction: false,

},

loop: true,

preventLinksPropagation: true,

});