slick: Force sliding behavior when centerMode: true and infinite: false, even when count of slides is less than slidesToShow

The current behavior of slick.js is that, when using centerMode, if there are less slides than the number of slides to show, slick.js will just show all the slides and prevent any sliding. This is not always the intended behavior. I have an application where I always want sliding, not matter how many slides. So even if I show 3 slides at a time and use centerMode, it should start with no slide on the left, the current (and first slide) at the center, and the second slide on the right, instead of showing all slides. Then I should be able to slide to the second and third slides like I would if I had more slides.

It would be handy to have a boolean setting for this behavior, or simply to decide to force the sliding behavior when using centerMode: true, infinite: false, no matter how many slides there are.

This is probably a duplicate of https://github.com/kenwheeler/slick/issues/1549, https://github.com/kenwheeler/slick/issues/1098, https://github.com/kenwheeler/slick/issues/1504, https://github.com/kenwheeler/slick/issues/1302, https://github.com/kenwheeler/slick/issues/262. It seems like a lot of people are having this issue that could be fixed with a new setting.

The workaround I’m currently using is to dynamically set slidesToShow: 1 when I have 1, 2 or 3 slides, and slidesToShow: 3 when I have 4 or more slides, but that means the interface looks slightly different depending on the number of slides. I’d like it to be consistent, no matter how many slides there are.

About this issue

  • Original URL
  • State: closed
  • Created 9 years ago
  • Comments: 18

Commits related to this issue

Most upvoted comments

I’m following this with interest.

Currently I’m using Slick in a Drupal site (using the related module) to show a list of images with the “boxed” theme, but when slidesToShow == numSlides the slider doesn’t get initialized and the theme doesn’t gets loaded correctly due to the different markup. It would be nice if the carousel was initialized anyway, even it would not be doing anything, just to have the same markup!

i fear we may have to move on. been pulling hair out over this for a while now. 😦

I’m having this issue as well. I have the same amount of slides as slidesToShow and while the slider does get initialized (the DIV:s are added by Slick) the slider looks broken, only displays 4 (out of 5) slides and no arrows or touch functionality are added.

Edit: In my case at least, it would be awesome if the slideshow could just function exactly the same as if I had one more slide in it, and let the user slide around regardless. Note that I do have infinite: true in my case though.

Setting slidesToShowed = 1 helped me.