question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

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

See original GitHub issue

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.

Issue Analytics

  • State:open
  • Created 8 years ago
  • Comments:16

github_iconTop GitHub Comments

2reactions
esolitoscommented, Sep 13, 2015

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!

1reaction
bobmagiciicommented, Jul 19, 2017

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

Read more comments on GitHub >

github_iconTop Results From Across the Web

Force sliding behavior when centerMode: true and infinite
Force sliding behavior when centerMode: true and infinite: false, even when count of slides is less than slidesToShow.
Read more >
Slick slider centermode not working when more slides than ...
which means, if the total number of slides (i.e. the .slide elements) is less than or equals to the value of the slidesToShow...
Read more >
Flickity · Options
Flicking, page dots, and previous/next buttons are mapped to group slides, not individual cells. is-selected class is added to the multiple cells in...
Read more >
bd-slick-carousel - npm
centerMode, boolean, false, Enables centered view with partial prev/next slides. Use with odd numbered slidesToShow counts.
Read more >
Slick Slider Not Loading Slides If Slidestoshow Is Equal To ...
Force sliding behavior when centerMode: true and infinite: false even when count of slides is less than slidesToShow. Is there a shim fix?...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found