Maanstraat Maanstraat - 6 months ago 64
Javascript Question

jQuery Owl Carousel 2 hide navigation

I am building a nice content slider with the 'Owl Carousel 2' only is it possible to hide the nav buttons when there is only one or times items visible?

And when there is only one item or two items visible that they get a second CSS class attached on the div.item?


like: when there is one item: class"item one" and when there are two boxes: class="item two" when there are more then 2 then it's will be only class="item".


JS:

jQuery("#sliderwhat").owlCarousel({
loop : true,
nav : true
});


HTML:

<div id="sliderwhat" class="box">

<div class="item">
<img src="image.jpg" alt="" />
<span>Personal guide / <span>Amsterdam</span></span>
<div>Here some text bla bla bla.</div>
</div>

</div>

Answer

Try this.

jQuery("#sliderwhat").owlCarousel({

        navigation : false, // Show next and prev buttons
        slideSpeed : 300,
        paginationSpeed : 400,
        singleItem:true

    });
  }