貓頭鷹旋轉木馬導航不起作用

Question

我有 2 個輪播，一個在另一個輪播下，我正在使用“navContainer”功能來更改導航箭頭的位置（我將它們放置在滑塊上方）。

當我有一個滑塊時，這可行，但是當我有 2 個（或更多）時，兩個滑塊的導航都位於第一個“navhere”div 中。 取而代之的是，每個導航按鈕都應該在自己的 div 中。

您可以更好地了解我在這里所說的內容： http : //jsfiddle.net/vnpm1y06/226/

代碼是：

<div class="about">
    <div id="navhere"></div> <!-- This is where nav should appear -->
    <div class="owl-carousel">
        <div class="item"><h4>About</h4></div>
        <div class="item"><h4>Us</h4></div>
    </div>
</div>
<div class="contact">
    <div id="navhere"></div> <!-- This is where nav should appear -->
    <div class="owl-carousel">
        <div class="item"><h4>Contact</h4></div>
        <div class="item"><h4>Form</h4></div>
    </div>
</div>

jQuery 是

 .owlCarousel({
        loop: true,
        margin: 10,
        nav: true,
        dots:false,
        items:1,
        navContainer: '#navhere'
    })

Answer 1

您不能復制id的值。 它必須是唯一的。 這就是原因。

仍然。 根據此問題 ， 尚未實施多個導航！

Answer 2

導航不起作用

.owlCarousel({
        startPosition: 0,
        margin: 20,
        dots: true,
        loop: true,
        autoplay: true,
        nav: true,
        pagination :true,
        autoplayTimeout:6000,
        responsiveClass:true,
        responsive:{
            0:{

                items:1
            },
            480:{

                items:2
            },
            568:{

                items:2
            },
            667:{

                items:2
            },
            768:{

                items:3
            },
            1024:{
                items:5
            }
        }
    });
});

Answer 3

如果您的可見項目少於總項目，則導航將自動禁用。 換句話說，您必須有足夠的項目才能查看 Owl-carouse 提供的導航