How can I disable previous/next in OwlCarousel2 if there aren't enough items to scroll?

Question

Is there a way to disable the previous and next links if there aren’t enough items to scroll?

For example: http://truewest.nextmp.net/special-programs these galleries al

Answer 1

Owl Carousel 2 provides a number of useful events which you can use to achieve this:

var $owl = $('.owl-carousel');

$owl.on('initialized.owl.carousel resized.owl.carousel', function(e) {
    $(e.target).toggleClass('hide-nav', e.item.count <= e.page.size);
});

$owl.owlCarousel({ ... });

This snippet hooks into the initialized and resized events to trigger a function when the slideshow is first initialised or when the page is resized. The function compares how many elements are in your slideshow with the page size (the number of slides shown at once); if there are only enough items to display one page, the hide-nav class gets added to the slideshow. You can then use CSS to hide the nav elements:

.hide-nav .owl-controls {
    display: none;
}

If you add or remove slides or anything fancy like that, you might need to hook into additional events so your nav is displayed or hidden as appropriate: http://www.owlcarousel.owlgraphic.com/docs/api-events.html