Javascript 获取 SLICK SLIDER 的当前幻灯片并将类添加到内部元素

Get Current slide of SLICK SLIDER and add Classes to inner elements

提问by Salih K

I have a Slick slider like the example shown in the slick page, I am using the code like this,

我有一个像光滑页面中显示的示例一样的光滑滑块，我正在使用这样的代码，

<div class="slideshow">
    <img src="http://lorempixel.com/500/250" />
    <img src="http://lorempixel.com/500/251" />
    <img src="http://lorempixel.com/500/249" />
</div>

with a thumbnail carousal

带有缩略图播放

<div class="thumbs">
    <img src="http://lorempixel.com/100/100/" />
    <img src="http://lorempixel.com/100/100/" />
    <img src="http://lorempixel.com/100/100/" />
</div>

Now the Js Code is something like this:

现在 Js 代码是这样的：

$('.slideshow').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  arrows: false,
  fade: true,
  asNavFor: '.thumbs'
});
$('.thumbs').slick({
  slidesToShow: 3,
  slidesToScroll: 1,
  asNavFor: '.slideshow',
  dots: true,
  centerMode: true,
  focusOnSelect: true
});

This works fine, but what I am trying to achive is on the current slide of thumb I want to add something, like class, or on inside element of current thumb( here eg: img).

这工作正常，但我想要实现的是在当前的拇指幻灯片上我想添加一些东西，比如类，或者在当前拇指的内部元素上（例如：img）。

I tried code like this:

我试过这样的代码：

$('.thumbs').on('beforeChange', function(event, slick, currentSlide, nextSlide){
                 $('.slick-current img').addClass('works');                 
                });

but not working, what is wrong with my code, Is there a way to get this work properlyl

但不工作，我的代码有什么问题，有没有办法让这个工作正常

采纳答案by Curiousdev

change you beforeChangefunction as below

改变你的beforeChange功能如下

$('.slideshow').on('beforeChange', function(event, slick, currentSlide, nextSlide){
      $(".slick-slide").removeClass('works');
      $('.slick-current').addClass('works');        
   });

Please find dis fiddlefor your reference

请找到 dis fiddle供您参考