kenwheeler / slick

the last carousel you'll ever need
kenwheeler.github.io/slick
MIT License
28.54k stars 5.89k forks source link

Slick-center not working when number of slides is a not a multiple of 3 or less than six with slidesToScroll = 3 #3517

Open shivanit2 opened 6 years ago

shivanit2 commented 6 years ago

I have given some margin top to my slick-center class.I want the slick slider to scroll 3 slides at once.These are my slider settings :

$(".center").slick({ dots: true, infinite: true, centerMode: true, slidesToShow: 3, slidesToScroll: 3 });

$(".center").slick('slickSetOption', 'slidesToScroll', 3, true); });

As slidesToScroll does not work with centerMode ,I'm using slickSetOption to force it to work with scrolling three slides at once.

The issue: This slick-center styling works perfectly fine when the number of slides in my slider are in multiples of 3.But whenever the number of slides are 4,5 .. or any non three multiple,the slick slider doesn't append the correct slide with the slick-center class.

This is my codepen :- https://codepen.io/shivanit2/pen/zLwzbR Currently there are 8 slides in my codepen,and you can see how its not giving the correct styling .(if you scroll on the third slick-dot) If you increase 1 slide,it will work perfectly.(multiple of 3's)

How can I resolve this issue?

lems3 commented 6 years ago

I got a similar problem, when we get less than 3 slides, the classes seems to work differently, and we have no way to really know in which "mode" we are on.

kadsyy commented 6 years ago

I don't know how but using the not minified js from the demo site solved my issue. http://kenwheeler.github.io/slick/slick/slick.js

It's a version 1.8.0. I have tried the same version from jsdeliver & cdnjs both not working. Weird that the minified version also not working.