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