在第一张幻灯片中滑动图像Slick Slider

我有这个光滑的滑块,我想在第一个当前活动幻灯片中拉伸图像

for example here example working slider you want to see this example. First current active slide is Stretch. How i can do it in the slick slider ?

$(document).ready(function() {

  $('.slider-nav').slick({
    slidesToShow: 3,
    slidesToScroll: 1,
    dots: true,
    centerMode: false,
    focusOnSelect: true
  });
});
.slider-nav div {
  width: 200px;
  height: 60px;
}

.slider-for {
  width: 250px;
  height: 250px;
  margin
}

.slider-wrap {
  positon: absolute;
  width: 300px;
  height: 300px;
  margin-left: 20px;
}

.slick-arrow:before {
  color: gray;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.css" rel="stylesheet" />

<div class="slider-wrap">


  <div class="slider-nav">
    <div>
      <img src="http://placehold.it/50x50"> </img>
    </div>
    <div>
      <img src="http://placehold.it/50x51"> </img>
    </div>
    <div>
      <img src="http://placehold.it/50x52"> </img>
    </div>
    <div>
      <img src="http://placehold.it/50x53"> </img>
    </div>
    <div>
      <img src="http://placehold.it/50x54"> </img>
    </div>
  </div>
  </div