테스트 사이트 - 개발 중인 베타 버전입니다

제이쿼리 질문입니다ㅠㅠ(슬릭슬라이더) 채택완료

바트컨트롤 4년 전 조회 2,213

slider에 active를 지우려고하는데

맨위 기본 active가 삭제가 안되고 그다음부터 삭제가 됩니다 ㅠ

조언 좀 부탁드릴게요 ㅠ

html

</p>

<p><div class="main_slide_wrap">

    <div class="main_slide pc_on">

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/main_slide1.jpg" alt=""></div>

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/main_slide2.jpg" alt=""></div>

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/main_slide3.jpg" alt=""></div>

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/main_slide4.jpg" alt=""></div>

    </div>

    <div class="main_slide mo_on">

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/mobile/main_slide1.jpg" alt=""></div>

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/mobile/main_slide2.jpg" alt=""></div>

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/mobile/main_slide3.jpg" alt=""></div>

        <div><img src="<?php echo G5_THEME_IMG_URL ?>/mobile/main_slide4.jpg" alt=""></div>

    </div>

    <div class="main_slide_btn mon">

        <a href="#none" data-slide="1" class="active">

            <span class="slide_circle"></span><span>01</span>

        </a>

        <a href="#none" data-slide="2">

            <span class="slide_circle"></span><span>02</span>

        </a>

        <a href="#none" data-slide="3">

            <span class="slide_circle"></span><span>03</span>

        </a>

        <a href="#none" data-slide="4">

            <span class="slide_circle"></span><span>04</span>

        </a>

    </div>

</div></p>

<p>

 

JS

</p>

<p>    $('.main_slide').on('afterChange', function(event, slick, currentSlide, nextSlide){ //슬라이드가 바뀔때

        var slide_no_pc =  $('.pc_on .slick-active').data('slick-index')+1; // 활성화 된 슬라이드의 data + 1

        var slide_no_mo = $('.mo_on .slick-active').data('slick-index')+1; // 활성화 된 슬라이드의 data + 1

        $('[data-slide]').removeClass('active'); //data-slide(탭)를 갖고있는 active를 다 지워라

        $('[data-slide='+slide_no_pc+']').addClass('active'); // data-slide와 data-slick-index를 비교하여 동일하다면 addClass

        $('[data-slide='+slide_no_mo+']').addClass('active'); // data-slide와 data-slick-index를 비교하여 동일하다면 addClass

    });</p>

<p>

 

결론:

$('[data-slide]').removeClass('active'); //data-slide(탭)를 갖고있는 active를 다 지워라

이게 잘 안먹습니다 ㅠ

 

 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트

slick()이전에 삭제해 보세요.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인