owlCarousel2, некорректная работа с autoWidth

Question

Есть каруселька, используется owlCarousel2 с autoWidth. Плагин некорректно отрабатывает - при начальном ините какая-то непонятное центрирование, клик по кнопкам навигации работает неправильно. При ресайзе блока на 1px всё становится "как надо". Кто сталкивался, как решить?

Песочница здесь.

function screenshotsCarousel() {
    var carousel = $('#screenCarousel');

    carousel.owlCarousel({
        loop: true,
        items: 2,
        margin: 20,
        lazyLoad: true,
        autoWidth: true,
        center: false,
        dots: false,
        nav: true
    });
}
screenshotsCarousel();

.screen-block {
  max-width: 768px;
  width: 100%;
}
.owl-stage {
   display: -webkit-box;
   display: -moz-box;
   display: -ms-box;
   display: box;
 }

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>



<div class="screen-block">
    <div id="screenCarousel" class="owl-carousel screen-carousel">
        <img class="owl-lazy" data-src="https://gamerangers.club/images/uploads/game/70501/secret-neighbor-1-wX-400-hX-240.png" />
        <img class="owl-lazy" data-src="https://gamerangers.club/images/uploads/game/70501/secret-neighbor-2-wX-400-hX-240.png" />
        <img class="owl-lazy" data-src="https://gamerangers.club/images/uploads/game/70501/secret-neighbor-3-wX-400-hX-240.png" />
    </div>
</div>

БЛОГ НА HUSL

owlCarousel2, некорректная работа с autoWidth

Ответы (0 шт):