Сова Карусель 2 Пользовательские точки не кликабельны - PullRequest
Новая
       21

Сова Карусель 2 Пользовательские точки не кликабельны

0 голосов
/ 11 октября 2018

Я использую Owl Carousel 2 и пытаюсь сделать пользовательские точки с текстом.Пользовательские точки отображаются, но ничего не происходит, когда вы нажимаете на них.Т.е. когда вы нажимаете на точку, она не возвращается к соответствующему слайду, она просто ничего не делает.Как я могу заставить карусель перейти на соответствующий слайд при нажатии пользовательских точек?

Полный код здесь: https://codepen.io/anon/pen/ZqKaEZ

HTML: 

<div class="owl-carousel owl-theme">
<div class="item" data-dot="<span>1</span>">
  <img src="https://placehold.it/100">
</div>
<div class="item" data-dot="<span>2</span>">
  <img src="https://placehold.it/100">
</div>
<div class="item" data-dot="<span>3</span>">
  <img src="https://placehold.it/100">
</div>
<div class="item" data-dot="<span>4</span>">
  <img src="https://placehold.it/100">
</div>

JS: 

$(document).ready(function(){
  $(".owl-carousel").owlCarousel({
        autoplay: true,
        autoplayTimeout: 4000,
        dots: true,
        dotsData:true,
        loop: true,
        margin: 30,
        nav: false,
        center: false,
        items: 1
    });
});

1 Ответ

0 голосов
/ 12 октября 2018

Вот код, который работал: 

$(document).ready(function(){
    let owl = $(".owl-carousel").owlCarousel({
        autoplay: false,
        autoplayTimeout: 2000,
        dots: true,
        dotsData:true,
        loop: true,
        margin: 30,
        nav: false,
        center: false,
        items: 1
    });

    $('.owl-dot').click(function() {
        owl.trigger('to.owl.carousel', [$(this).index(), 1000]);
    })
});
...