Markup

slick.js 슬릭 슬라이드 변경될때 마다 태그에 클래스 추가

black-berry 2022. 11. 16. 17:51
728x90
반응형

 

슬릭 슬라이드 한 페이지씩 넘어갈때 마다 클래스 없앴다가 추가하기

$('.slider').slick({
    infinite: true,
    autoplay: true,
    autoplaySpeed: 2000,
    speed: 300,
    fade: false,
    arrows: true,
    cssEase: 'ease-in-out',
});

var tag = $('.section-slide .title-box');
$('.slider').on('afterChange', function (event, slick, currentSlide, nextSlide) {
    tag.attr('class', 'title-box');
    tag.addClass("current" + currentSlide);

    $(".sticker").attr('class', 'sticker');
    switch (currentSlide) {
        case 0:
            $(".sticker-1 .sticker").addClass("act");
            break;

        case 1:
            $(".sticker-2 .sticker").addClass("act");
            break;

        case 2:
            $(".sticker-3 .sticker").addClass("act");
            break;

    }
});

 

https://kenwheeler.github.io/slick/

728x90
반응형