javascriptjquerycssowl-carouselowl-carousel-2

How do I specify number of items to be shown in Owl carousel 2?

In Owl carousel 1 I could specify different number of items to be shown depending on the viewport width:

items:5,
itemsDesktop:[1199,4],
itemsDesktopSmall:[979,3],
itemsTablet:[768,2],
itemsMobile:[479,1]

However, the code above doesn't work with Owl carousel 2. Also the specs suggest the only option to use:

items: 3 // or any ther number here

So it's the same number of items shown on mobile and desktop. Did I miss something?

Solution

  • Try using the responsive option. Read here in the docs: https://owlcarousel2.github.io/OwlCarousel2/docs/api-options.html

    On this thread hvsh is giving an example right at the bottom: https://github.com/OwlCarousel2/OwlCarousel2/issues/1363

    Also on the demo page they give an example: https://owlcarousel2.github.io/OwlCarousel2/demos/responsive.html