Obtenir de la diapositive Actuelle de la NAPPE CURSEUR et ajouter des Classes à l'intérieur des éléments

J'ai une Nappe de curseur comme dans l'exemple montré dans la nappe de la page, je suis en utilisant le code comme ceci,

<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>

avec une vignette 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>

Maintenant le Code Js est quelque chose comme ceci:

$('.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
});

Cela fonctionne bien, mais ce que je suis en train de réaliser est sur la diapositive en cours de pouce je veux ajouter quelque chose, comme la classe, ou à l'intérieur de l'élément de courant pouce( ici par exemple: img).

J'ai essayé le code comme ceci:

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

mais ne fonctionne pas, quel est le problème avec mon code, Est-il un moyen d'obtenir ce travail properlyl

Ajouter un gestionnaire d'événements click sur ".thumbs > img", alors vous pouvez utiliser $(this) pour accéder à l'cliqué sur img et de le modifier.

OriginalL'auteur Salih K | 2017-03-27