Owl Carousel 2 to.owl.carousel event problem
If you set 0 as transition speed when triggering to.owl.carousel event, it doesn't work
HTML
<link rel="stylesheet" href="//cdn.rawgit.com/smashingboxes/OwlCarousel2/2.0.0-beta.3/dist/assets/owl.carousel.css">
<link rel="stylesheet" href="//cdn.rawgit.com/smashingboxes/OwlCarousel2/2.0.0-beta.3/dist/assets/owl.theme.default.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdn.rawgit.com/smashingboxes/OwlCarousel2/2.0.0-beta.3/dist/owl.carousel.js"></script>
<div class="owl-carousel owl-theme">
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/692_1531800232.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/691_1531731042.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/705_1532337058.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/687_1531909027.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/698_1531986497.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/703_1532082602.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/704_1532139784.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/708_1532487676.jpeg">
</div>
<div class="item" style="height: auto;">
<img src="http://sovrinmagazine.com/assets/upload/thumbnail/709_1532595216.jpeg">
</div>
</div>
...
JavaScript
var carousel = $('.owl-carousel').owlCarousel({
items: 1,
margin: 10,
nav: true,
dots: false,
loop: true,
navSpeed: 1500,
onChanged: function(event) {
$('#debug').html(event.item.index + '/' + event.item.count);
},
});