如何使水平时间轴滑块正确定向

时间:2017-07-14 11:55:41

标签: javascript jquery css slider

在水平时间轴滑块jquery中,我希望默认情况下它是正确的。如图所示,2015年价格合适。我想要最正确的2017年价格是默认选择,用户可以滚动到左边

enter image description here

我的代码

$('.timeLine-slider').slick({
 dots: true,
 infinite: false,
 speed: 300,
 slidesToShow: 4,
 slidesToScroll: 4,

});

1 个答案:

答案 0 :(得分:1)

使用initialSlide选项。

$(document).ready(function() {
  $('.timeLine-slider').slick({
    dots: true,
    infinite: false,
    speed: 300,
    slidesToShow: 4,
    slidesToScroll: 4,
    initialSlide: 4
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script>
<link href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css" rel="stylesheet" />

<div class="timeLine-slider">
  <div>2010</div>
  <div>2011</div>
  <div>2012</div>
  <div>2013</div>
  <div>2014</div>
  <div>2015</div>
  <div>2016</div>
  <div>2017</div>
</div>