Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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>
like image 692
Maanstraat Avatar asked Dec 24 '22 23:12

Maanstraat


1 Answers

Try this.

jQuery("#sliderwhat").owlCarousel({

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

    });
  }
like image 121
yanioconjota Avatar answered Dec 28 '22 05:12

yanioconjota