jquery - Ken Wheeler Slick Slider 1.4 - .slick-active 正在激活 asNavFor 中所有可见的内容，而不是显示的内容

Question

当用户单击拇指或主 slider 前进时，您可能会认为 .slick-active 会在拇指中指示主 slider 中镜像的幻灯片，但实际上所有拇指设置为.slick-active。我正在使用此脚本的 1.4 版本。

演示:https://jsbin.com/mevaga/1/edit?html,js,output

$(document).ready(function() {

    $('.portfolio-thumb-slider').slick({
        slidesToShow: 4,
        slidesToScroll: 1,
        asNavFor: '.portfolio-item-slider',
        dots: false,
        arrows: false,
        focusOnSelect: true
    });


    $('.portfolio-item-slider').slick({
        slidesToShow: 1,
        slidesToScroll: 1,
        arrows: false,
        asNavFor: '.portfolio-thumb-slider'
    });


});

我尝试过什么:slick slider - syncing autoplay and active navigation ——这不行。它曾经在这个脚本的旧版本中工作，但只是最初，一旦幻灯片前进，它就不起作用了。

Answer 1

所以我摆弄了一下，这似乎有效:

$('.portfolio-thumb-slider').on('afterChange', function(event, slick, currentSlide, nextSlide){
  //remove all active class
  $('.portfolio-thumb-slider .slick-slide').removeClass('slick-active1');
  //set active class for current slide
     $('.portfolio-thumb-slider .slick-slide:not(.slick-cloned)').eq(currentSlide).addClass('slick-active1');  

.slick-active1 始终赋予当前事件拇指。

我同意你的观点，奇怪的是这个 slider 本身没有这个功能。

<强> Final working example