Swiper Pagination(分页) - renderBullet(index, className)

渲染分页器小点。这个参数允许完全自定义分页器的指示点。接受指示点索引和指示点类名作为参数。

renderBullet(index, className)信息

类型:
function
默认:
null
启用版本:
4.0.0

效果演示

Slide 1
Slide 2
Slide 3
Slide 4
Slide 5
Slide 6
Slide 7
Slide 8
Slide 9
Slide 10
 
Slide 1
Slide 2
Slide 3
Slide 4
Slide 5
 

 

一个小应用 下载

使用方法示例

从Swiper7开始,容器默认类名由'.swiper-container'变更为'.swiper'。
<script>
var swiper = new Swiper('.swiper', {
  pagination: {
        el: '.swiper-pagination',
        clickable: true,
        renderBullet: function (index, className) {
          return '<span class="' + className + '">' + (index + 1) + '</span>';
        },
     /* renderBullet: function (index, className) {
          switch(index){
            case 0:text='壹';break;
            case 1:text='贰';break;
            case 2:text='叁';break;
            case 3:text='肆';break;
            case 4:text='伍';break;
          }
          return '<span class="' + className + '">' + text + '</span>';
        },*/
  },
});  
</script>