问题描述
我的首页上有多个光滑的滑块。现在我想添加一个计数器来显示当前幻灯片和最大幻灯片。
例如,id 为 33
的滑块有 4 个图像,因此它应该显示 1 of 4
,并且在转到下一张幻灯片时它应该显示 2 of 4
。它已经在工作,但是当我在滑块上滑动时,首页上的所有其他幻灯片也会上升 1。它应该只发生在我改变的滑块上。
这是我目前使用的代码:
$('.image-slider').each(function (key,item){
var id = $(this).attr("id");
var sliderId = '#' + id;
var appendArrowsClassName = '#' + id + 'slider__arrows';
var $status = $('.slider-paging');
$(sliderId).on('init reInit afterChange',function(event,slick,currentSlide,nextSlide){
//currentSlide is undefined on init -- set it to 0 in this case (currentSlide is 0 based)
var i = (currentSlide ? currentSlide : 0) + 1;
$status.text(i + '/' + slick.slideCount);
});
$(sliderId).slick({
infinite: true,dots: false,appendArrows: (appendArrowsClassName),prevArrow: '<div class="left d-inline-block"><i class="fas fa-caret-circle-left"></i></div>',nextArrow: '<div class="left d-inline-block"><i class="fas fa-caret-circle-right"></i></div>'
});
});
非常感谢!
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)