tab 메뉴 어떤 오류가 있는걸까요? 채택완료
ndkln
3년 전
조회 4,165
이미지와 같이 tab01을 눌렀을 땐 정상적으로 뜨는데 tab02와 tab03을 클릭했을 땐 컨텐츠가 뜨지않습니다.
혹시 어떻게 수정해야하는지 알려주실 수 있으신가요?
</p>
<p><div class="bna-slide"></p>
<p> <ul class="tabs tabs01"></p>
<p> <li class="tab-link current" data-tab="tab-1">tab01</li></p>
<p> <li class="tab-link" data-tab="tab-2">tab02</li></p>
<p> <li class="tab-link" data-tab="tab-3">tab03</li></p>
<p> </ul></p>
<p> </p>
<p> <div id="tab-1" class="tab-content tab-content01 current"></p>
<p> <div class = "container"></p>
<p> <img src="<?php echo G5_URL;?>/resource/img/sub/bna01-1.jpg" alt="Before"/></p>
<p> <img src="<?php echo G5_URL;?>/resource/img/sub/bna01-2.jpg" alt="After"/></p>
<p> </div></p>
<p> </div></p>
<p> <div id="tab-2" class="tab-content tab-content02"></p>
<p> <div class = "container"></p>
<p> <img src="<?php echo G5_URL;?>/resource/img/sub/bna01-1.jpg" alt="Before"/></p>
<p> <img src="<?php echo G5_URL;?>/resource/img/sub/bna01-2.jpg" alt="After"/></p>
<p> </div></p>
<p> </div></p>
<p> <div id="tab-3" class="tab-content tab-content03"></p>
<p> <div class = "container"></p>
<p> <img src="<?php echo G5_URL;?>/resource/img/sub/bna01-1.jpg" alt="Before"/></p>
<p> <img src="<?php echo G5_URL;?>/resource/img/sub/bna01-2.jpg" alt="After"/></p>
<p> </div></p>
<p> </div></p>
<p> </div></p>
<p> </p>
<p> <script></p>
<p> $(function() {</p>
<p> $('ul.tabs01 li').click(function(){</p>
<p> var tab_id = $(this).attr('data-tab');</p>
<p> </p>
<p> $('ul.tabs01 li').removeClass('current');</p>
<p> $('.tab-content01').removeClass('current');</p>
<p> </p>
<p> $(this).addClass('current');</p>
<p> $("#"+tab_id).addClass('current');</p>
<p> });</p>
<p> });</p>
<p> </script></p>
<p>
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
답변을 작성하려면 로그인이 필요합니다.
로그인
display: none;
padding: 30px 25px 0 0;
}
.tab-content.current{
display: inherit;
}
이렇게 되어있습니다. 이 부분을 지우면 될까요...?
정말 죄송한데 show, hide는 어떻게 하는건지 알려주실 수 있으신가요...