时间戳

首页 > 解决方案 > 设置 initialSlide 时，光滑的滑块不起作用

javascript - 设置 initialSlide 时，光滑的滑块不起作用

问题描述

我不明白为什么当我有一组幻灯片时幻灯片不滑动initialSlide。我指的是https://kenwheeler.github.io/slick/上的文档，但无法弄清楚问题所在。

$('.container').slick({
  initialSlide: 4,
  infinite: false,
  slidesToShow: 3,
  slidesToScroll: 1
})
* {
  box-sizing: border-box;
}

.container {
  width: 120px;
}

.slide {
  border: 1px solid red;
  width: 40px;
}
<link href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>

<div class="container">
  <div class="slide">1</div>
  <div class="slide">2</div>
  <div class="slide">3</div>
  <div class="slide">4</div>
  <div class="slide">5</div>
</div>

标签： javascripthtmlcssslick.js

解决方案

这是工作

$('.container').slick({infinite: false, slidesToShow: 2, slidesToScroll: 1, initialSlide: 3 })

你有5张幻灯片，但是你指定的初始是4张，同时显示3张。但是初始1是幻灯片2，初始4是幻灯片5，但是slidesToShow：3。滑块没有任何备用要显示的幻灯片

当我写答案时，评论中已经给出了

推荐阅读