我创建了一个带有分数分页计数"01/010"的猫头鹰轮播。我只需要在总幻灯片数大于 0 时删除 10 之前的数字 9,否则,它将保持不变。
$(function(){
$('.ivySlide').owlCarousel({
smartSpeed: 500,
items: 1,
margin:0,
nav:true,
dots:false,
onInitialized:counter,
onTranslated:counter
});
function counter(event) {
var element = event.target;
var items = event.item.count;
var item = event.item.index + 1;
var sldtxt = $('.active .ivySlideTxt').html();
var sldWidth = 100;
var sldPercent = sldWidth * item / items;
$('#counter').html("0"+item+" / 0"+items);
$('.slTxt').html(sldtxt);
$('.slideState span').css("width", sldPercent + "%");
$('.slideState span').html(sldPercent + "%")
}
});
请在此处查看链接 - https://codepen.io/tsarkar/pen/NmpGmV
您可以检查item
和items
是否小于 10 并作为前缀0
$(function(){
$('.ivySlide').owlCarousel({
smartSpeed: 500,
items: 1,
margin:0,
nav:true,
dots:false,
onInitialized:counter,
onTranslated:counter
});
function counter(event) {
var element = event.target;
var items = event.item.count;
var item = event.item.index + 1;
var sldtxt = $('.active .ivySlideTxt').html();
var sldWidth = 100;
var sldPercent = sldWidth * item / items;
if(item<10) {
item = "0"+item;
}
if(items<10) {
items = "0"+items;
}
$('#counter').html(item+" / "+items);
$('.slTxt').html(sldtxt);
$('.slideState span').css("width", sldPercent + "%");
$('.slideState span').html(sldPercent + "%")
}
});