Javascript 光滑的滑块用数字替换点
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/34660680/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Slick slider replace dots with numbers
提问by Mills
I'm trying to replace Slick slider / carousel pagination with numbers instead of dots. I have the project setup in js fiddle and I have have a custom function that displays the current slide count of a total of 6. I currently just have '1' replacing the dots but I would like to have the numbers represent the total number of slides.
我正在尝试用数字而不是点替换 Slick 滑块/轮播分页。我在 js fiddle 中设置了项目,我有一个自定义函数,显示当前幻灯片总数为 6。我目前只用“1”代替点,但我想让数字代表总数幻灯片。
HTML
HTML
<section class="slider">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
<div>slide4</div>
<div>slide5</div>
<div>slide6</div>
</section>
<span class="pagingInfo"></span>
Javascript
Javascript
$(".slider").slick({
autoplay: true,
dots: true,
customPaging : function(slider, i) {
var thumb = $(slider.$slides[i]).data();
return '<a>1</a>';
},
responsive: [{
breakpoint: 500,
settings: {
dots: false,
arrows: false,
infinite: false,
slidesToShow: 2,
slidesToScroll: 2
}
}]
});
回答by IanGabes
If i catch your meaning, Change this line:
如果我理解您的意思,请更改此行:
return '<a>1</a>';
to this:
对此:
return '<a>'+i+'</a>';
or
或者
return '<a>'+(i+1)+'</a>';
depending on where you want your index to start.
取决于您希望索引从哪里开始。
Here is your updated fiddle: https://jsfiddle.net/rLLvvpcm/5/
这是您更新的小提琴:https: //jsfiddle.net/rLLvvpcm/5/