如何使用owlcarousel无法看到点/导航按钮?

bob*_*e01 10 html css jquery owl-carousel

为什么导航按钮不可见?

我正在使用jQueryowlcarousel(http://owlgraphic.com/owlcarousel/).

http://jsfiddle.net/bobbyrne01/s10bgckL/1/

截图

html ..

<div id="owl-demo">
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
    <div class="item">
        <img src="http://placehold.it/50x50" alt="Owl Image" />
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

js ..

$(document).ready(function () {
    $("#owl-demo").owlCarousel({

        autoPlay: 3000, //Set AutoPlay to 3 seconds
        dots: true,
        items: 2,
        itemsDesktop: [1199, 3],
        itemsDesktopSmall: [979, 3]
    });
});
Run Code Online (Sandbox Code Playgroud)

css ..

#owl-demo .item {
    margin: 3px;
}
#owl-demo .item img {
    display: block;
    width: 50%;
    height: auto;
}
Run Code Online (Sandbox Code Playgroud)

im1*_*ike 19

您拥有的缩小的css文件似乎没有该元素的样式:.owl-theme .owl-controls .owl-page span.

以下是owlgraphic.com网站上演示所应用的样式:http: //jsfiddle.net/s10bgckL/2/


Cha*_*eep 7

pagination:false,
navigation:true
Run Code Online (Sandbox Code Playgroud)

试试这个