next prev 버튼을 무한으로 하려면 어떻게 해야할까요..
본문
현재 소개페이지때문에 간단한 탭메뉴를 만들고 있는데요
탭메뉴에 [ 이전 , 다음 ] 버튼을 넣고 있거든요
뭘 제대로 알고하는건 아니고, 어디서 샘플 같은거 있으면 들여다보면서 최대한
제 수준 ( 초보 ) 에 맞게 간단히 하면서 하고 있는데..
아래와 같은식으로 하려고 하고 있거든요.
이전 혹은 다음 버튼은 스크립트로
li 기준으로 a 를 찍는형식으로 해서
이전버튼 다음버튼을 넣었는데..
일딴 탭메뉴 잘되고 있고, 이전 다음버튼 잘되고 있습니다 ㅠ
한데....다음버튼을 막 눌러서......이걸..마지막 단계로 가게되면 다시 처음 1번이 나오게 하고싶거든요..
( 무한으로 돌고싶은데..)
검색을 해봐도..이게 뭔지 몰라서..엄한것만 나오고 있고...
어떤식으로 해야할까...지혜를 좀 구해봅니다 ㅠ
(뭘공부해야하는지 그런것)
css는 아직 하나도 안했고..그냥 제가 쓴 기본 코드입니다
<!----------- ul --------->
<ul class="nav nav-tabs" role="tablist">
<li class="active"><a href="#test_a1" role="tab" data-toggle="tab">테스트A</a></li>
<li><a href="#test_a2" role="tab" data-toggle="tab">
테스트B</a></li>
<li><a href="#test_a3" role="tab" data-toggle="tab">
테스트C</a></li>
</ul>
<!----------- 이전 다음 버튼 --------->
<a class="btn btn-primary btnPrevious" >이전</a>
<a class="btn btn-primary btnNext" >다음</a>
<!----------- 컨텐츠 내용--------->
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active" id="test_a1">
A내용
</div>
<div role="tabpanel" class="tab-pane fade" id="test_a2">
B내용
</div>
<div role="tabpanel" class="tab-pane fade" id="test_a3">
C내용
</div>
</div>
<!----------- 이전 다음 버튼 스크립트 --------->
<script>
$('.btnNext').click(function(){
$('.nav-tabs > .active').next('li').find('a').trigger('click');
});
$('.btnPrevious').click(function(){
$('.nav-tabs > .active').prev('li').find('a').trigger('click');
});
</script>
답변을 작성하시기 전에 로그인 해주세요.
