Slider in infinite mode not creating clones when slidesToShow === slideCount

Expected behavoir: when initial code looks like this:

<div id="slider">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>
<script>
  $('#slider').slick({ slidesToShow: 3, slidesToScroll: 1 });
</script>

then generated code should look like this:

<div id="slider">
  <div class="slick-cloned">1</div>
  <div class="slick-cloned">2</div>
  <div class="slick-cloned">3</div>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div class="slick-cloned">1</div>
  <div class="slick-cloned">2</div>
  <div class="slick-cloned">3</div>
</div>

currently there are none of slick-cloned elements generated if slidesToShow === slideCount

my dirty fix was to replace this _.slideCount > _.options.slidesToShow with _.slideCount >= _.options.slidesToShow which fixes my issue … but i would prefer correct fix …

[YuanWenqing]

We had a similar issue like this: if slideCount <= slidesToShow and initialSlide > 0, all slides before initialSlide will be hidden.

Actually we can accept that no cloned slides is generated in this situation, but it’s really a big problem that some slides are hidden. The reason is the incorret value of transform in style of slick-track element.

We do a tricky hotfix:

  function fixSlickStyle(event, slick) {
    if (slick.slideCount <= slick.options.slidesToShow) {
      slick.$slideTrack.css('transform','');
    }
  }

  $('.slider-class')
  .on('setPosition', function(event, slick) {
    fixSlickStyle(event, slick);
  })
  .on('afterChange', function(event, slick, currentSlide){
    fixSlickStyle(event, slick);
  })

[jaimerportmann]

you cannot set the slide with or max-width, I removed that and fixed it. as the slider defines the width of each slide