idangerous swiper，分页数

Question

可以在每个“swiper-pagination-switch”跨度中显示幻灯片的编号吗？ （如：1,2,3，...）？

默认情况下，该插件创造HTML的一部分这样的：

<div class="pagination"> 
    <span class="swiper-pagination-switch swiper-visible-switch swiper-active-switch"></span> 
    <span class="swiper-pagination-switch"></span> 
    <span class="swiper-pagination-switch"></span></div> 
</div> 

我想吨插入到每个跨越与其相关幻灯片的编号，例如：

<div class="pagination"> 
    <span class="swiper-pagination-switch swiper-visible-switch swiper-active-switch">1</span> 
    <span class="swiper-pagination-switch">2</span> 
    <span class="swiper-pagination-switch">3</span></div> 
</div> 

我如何做到这一点？

谢谢。

Answer 1

这是我的解决方案，有点脏，但它做的工作：

var Swiper_slider = slider.swiper({ 
      pagination:   '.slider_pagination', 
      paginationClickable: true, 
      mode:    'horizontal', 
      loop:    true, 
      speed:    600, 
      autoplay:   5000, 
      paginationElement: 'a', 
      onSwiperCreated: function(){ 

       $('.slider_pagination a').each(function(key){ 
        $(this).html(key + 1); 
       }); 

      } 
}); 

一旦滑块创建一个.each()环路上添加分页元素的数字。

雅尼克

Answer 2

组队，探索V3.1.0将有以下的参数，它支持此功能。

paginationBulletRender(index, className) 

Answer 3

在组队，探索V3.3.1

有演示其可能适合你的问题被称为包含在下载的zip 29定制pagination.html：

与选项：

var swiper = new Swiper('.swiper-container', { 
    pagination: '.swiper-pagination', 
    paginationClickable: true, 
    paginationBulletRender: function (index, className) { 
     return '<span class="' + className + '">' + (index + 1) + '</span>'; 
    }