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>
Try this.
jQuery("#sliderwhat").owlCarousel({
navigation : false, // Show next and prev buttons
slideSpeed : 300,
paginationSpeed : 400,
singleItem:true
});
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With