slick slider : 현재 슬라이드 확인

적용 방법:

$(".slick-slider").on("afterChange", function(){

  ...

});

 

 

레퍼런스:

afterChange(slick, currentSlide)	슬라이드 후 호출
beforeChange(slick, currentSlide)	슬라이드 전 호출

 

적용 예시)

const sEl = $(".slider");
      const elem = $(".slider .box");
      $("#count").html(
        "<span class='now'>1</span><span> / " + elem.length + "</span>"
      );

      sEl.slick({
        dots: true,
        arrows: true,
        infinite: true,
        autoplay: true,
        autoplaySpeed: 1000,
      });

      sEl.on(
        "init reInit beforeChange afterChange",
        function (event, slick, currentSlide, nextSlide) {
          var i = (currentSlide ? currentSlide : 0) + 1;
          $("#count").html(
            "<span class='now'>" +
              i +
              "</span><span> / " +
              slick.slideCount +
              "</span>"
          );
        }
      );