Question

<div id="started-carousel">
      <div id="started-panel-01">1</div>
      <div id="started-panel-02">2</div>
      <div id="started-panel-03">3</div>
      <div id="started-panel-04">4</div>
</div>
<div id="started-carousel-nav" class="flex-container">
      <div class="flex-item">1</div>
      <div class="flex-item">2</div>
      <div class="flex-item">3</div>
      <div class="flex-item">4</div>
</div>

$("#started-carousel").owlCarousel({
        dots: false,
        items: 1,
        itemsDesktop: [1199, 1],
        itemsDesktopSmall: [979, 1],
        itemsTablet: [768, 1],
        itemsMobile: [479, 1],
        singleItem: !0,
        slideSpeed: 700,
        rewindNav: !1,
        touchDrag: !1,
        mouseDrag: !1,
        afterAction: t
    });
    var c = $("#started-carousel").data("owlCarousel");
    $("#started-carousel .next").click(function() {
        c.next()
    });
    var s = $("#started-carousel-nav > .flex-item").click(function() {
        var t = s.index(this);
        //c.goTo(t)
       $("#started-carousel").owlCarousel();
       $("#started-carousel").trigger("to.owl.carousel", [0, 500, true]);
    });

在旋转木马外面，旋转木马导航就在它自己的div中。

c.goTo()不是控制台提到的功能。检查谷歌，它在doc中不存在。在to.owl.carousel上找到答案并进行测试。旋转木马导航表现不准确。例如，单击1，它将不会转到幻灯片1.如果单击2，它将返回1.不确定为什么它表现不正确。感谢帮助。

Answer 1

我认为您不必创建导航。 Owl-Carousel默认有导航。如果您使用的是版本2，则应在此处查看：Docs & Demos。

如果您使用的是第一个版本，则应使用

navigation: true

而不是

nav: true

图书馆将在DOM中添加导航。

移动自定义分页并正确显示幻灯片

1 个答案: