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

스크립트 질문 입니다. 채택완료

웹프리죤 1년 전 조회 1,091

이전 다음 버튼 구현 중인데

순차적으로 되어야 되는데 먼가 중간 객체를 건너띄는 현상이 있는데 어디가 잘못된걸까요?

 

저 부분이 2가 되어야 되는데 이상하네요.

http://sir.kr/data/editor/2405/32936023_1714636362.6245.png" width="715" />

 

</p>

<p>$('.tabBtn_next').click(function(){

        

        $(".newsWrapWrap .newsWrap").removeClass('active');

        if($(".tabItem > .item:nth-child(1)")) {

            $(".newsWrapWrap .newsWrap").removeClass('active');

            $(".newsWrapWrap > .newsWrap:nth-child(1)").addClass('active');

        }

        if($(".tabItem > .item:nth-child(2)")) {

            $(".newsWrapWrap .newsWrap").removeClass('active');

            $(".newsWrapWrap > .newsWrap:nth-child(2)").addClass('active');

        }

        if($(".tabItem > .item:nth-child(3)")) {

            $(".newsWrapWrap .newsWrap").removeClass('active');

            $(".newsWrapWrap > .newsWrap:nth-child(3)").addClass('active');

        }

        

        $('.tabItem').find('.active').next().addClass('active');

        $('.tabItem').find('.active').prev().removeClass('active');

        //console.log(tab_num);

    });

    $('.tabBtn_prev').click(function(){

        

        $(".newsWrapWrap .newsWrap").removeClass('active');

        if($(".tabItem > .item:nth-child(3)")) {

            $(".newsWrapWrap .newsWrap").removeClass('active');

            $(".newsWrapWrap > .newsWrap:nth-child(3)").addClass('active');

        }

        if($(".tabItem > .item:nth-child(2)")) {

            $(".newsWrapWrap .newsWrap").removeClass('active');

            $(".newsWrapWrap > .newsWrap:nth-child(2)").addClass('active');

        }

        if($(".tabItem > .item:nth-child(1)")) {

            $(".newsWrapWrap .newsWrap").removeClass('active');

            $(".newsWrapWrap > .newsWrap:nth-child(1)").addClass('active');

        }

        

        $('.tabItem').find('.active').prev().addClass('active');

        $('.tabItem').find('.active').next().removeClass('active');

        //console.log(tab_num);

    });</p>

<p>

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

답변 2개

채택된 답변
+20 포인트
1년 전

</p>

<p>$('.tabBtn_next').click(function(){</p>

<p>    next++;</p>

<p>    if(next == $(".tabItem > .item").length){</p>

<p>        next = 0;</p>

<p>    }</p>

<p>    $(".newsWrapWrap .newsWrap").removeClass("active").eq(next).addClass("active");</p>

<p>})</p>

<p>let prev = 0;</p>

<p>$('.tabBtn_prev').click(function(){</p>

<p>    prev--;</p>

<p>    if(prev == -1){</p>

<p>        prev = $(".tabItem > .item").length-1;</p>

<p>    }</p>

<p>    $(".newsWrapWrap .newsWrap").removeClass("active").eq(prev).addClass("active");</p>

<p>})</p>

<p>

 

전체 코드 및 예제 사이트가 (구조를 정확하게 몰라) 없어서 올려주신 코드 분석 해서 작성했습니다.

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

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

위 코드로는 100% 정확한 답변을 알수 없어요.

그냥 각 페이지별로 인덱스를 부여하셔서 작업하세요..

add 와 remove 조합이면 많이 조잡해보입니다.

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

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

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

로그인