Добрый день. Есть слайдер, внутри слайдов - еще слайдер. При подсчете количества слайдов внешнего слайдера при инициализации - считает верно, но при событии перемещения или изменения () - неверно. Кто с таким сталкивался?
var owl2 = $(".our_works .slider").owlCarousel({
nav:false,
items: 1,
dots: false,
onInitialized: carousInitialize,
});
var owl3 = $(".our_works .slider_img").owlCarousel({
nav:false,
mouseDrag: false,
//autoplay: true,
//loop: true,
items: 1,
dots: true,
});
function carousInitialize(event){
var showItems = event.item.index;
var countItems = event.item.count;
console.log(showItems);
console.log(countItems);
if(showItems < 9){
var nul_str = "0" + (showItems + 1);
$('.our_works .current_n').html(nul_str);
}
else{
$('.our_works .current_n').html(showItems + 1);
}
if(countItems < 10){
var nul_str = "0" + countItems;
$('.our_works .count_n').html(nul_str);
}
else{
$('.our_works .count_n').html(countItems);
}
}
owl2.on('translated.owl.carousel', function(event){
carousInitialize(event);
});
<div class="slider owl-carousel">
<div class="our_works_item">
<div class="container">
<div class="row">
<div class="col-12 col-md-5 offset-md-1 order-md-2">
<div class="slider_img owl-carousel">
<img src="images/our_w.jpg" class="img-fluid" alt="">
<img src="images/our_w.jpg" class="img-fluid" alt="">
<img src="images/our_w.jpg" class="img-fluid" alt="">
</div>
</div>
<div class="col-12 col-md-6 order-md-1">
<div class="our_works_text">
...
</div>
</div>
</div>
</div>
</div>
<div class="our_works_item">
<div class="container">
<div class="row">
<div class="col-12 col-md-5 offset-md-1 order-md-2">
<div class="slider_img owl-carousel">
<img src="images/our_w.jpg" class="img-fluid" alt="">
<img src="images/our_w.jpg" class="img-fluid" alt="">
<img src="images/our_w.jpg" class="img-fluid" alt="">
</div>
</div>
<div class="col-12 col-md-6 order-md-1">
<div class="our_works_text">
...
</div>
</div>
</div>
</div>
</div>
</div>