OwlCarousel2 / OwlCarousel2

DEPRECATED jQuery Responsive Carousel.

Home Page:http://owlcarousel2.github.io/OwlCarousel2/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Create same cards copy in case of "loop: true" if cards are lest then the number of cards to show on screen.

Shubham0601y opened this issue · comments

If we use the infinite loop property in the slider then suppose we are showing 4 cards in a row and currently we have only 2 cards card A & card B then, in that case, it makes the copy of card A & card B to cover 4 cards in a row.

But there should be a system that if the cards to be shown is less then cards available & "loop: True" is applied then it should hide the next / prev buttons & pointers instead of making a copy of existing cards.>

// -------- RJ slider
$(".owl-carousel.rjSlide").owlCarousel({
loop: true,
margin: 15,
items: 5,
autoplay: true,
autoplayTimeout: 4000,
smartSpeed: 450,
autoplayHoverPause: true,
nav: true,
dots: false,
responsive: {
0: {
items: 1,
},
790: {
items: 3,
},
1200: {
items: 4,
},
1300: {
items: 5,
},
},
});
});

I used this code on the client's site where cards are coming dynamically and the client wants the card to slide infinite but if he puts 2 cards then it makes copies of that 2 cards to make 4 cards to show at a time.

Update your code with these options and it should work.
loop: false, rewind: true