[그누보드5 X] 탭메뉴 전체
본문
http://www.webpaper.kr/show/102&page=1
그누보드5 기능 말고 개인적인 질문이긴한데요 ㅠㅠ 죄송합니다 물어볼데가없어서,,
위페이지 따라서 탭메뉴 html,css,jquery 까지 해서 잘 나오는데요!
전체를 넣고싶은데 jquery 가 막혀서 질문드립니다
<div class="tab">
<ul>
<li data-id="all" class="on">전체</li> <!-- 전체 -->
<li data-id="con1">tab1</li>
<li data-id="con2">tab2</li>
<li data-id="con3">tab3</li>
</ul>
<div id="all" class="conBox on">
<!-- 전체 리스트가 다 나오게 -->
</div>
<div id="con1" class="conBox">
cont1
</div>
<div id="con2" class="conBox">
cont2
</div>
<div id="con3" class="conBox">
cont3
</div>
</div>
<script>
$(function(){
// tab 메뉴를 클릭하였을 때 동작함
$(".tab ul li").click(function(){
// 현재 선택되어있던 메뉴들을 초기화함
$(".tab ul li").removeClass('on');
$(".tab .conBox").removeClass('on');
// 선택된 메뉴에 on 클래스를 주어 표기함
$(this).addClass('on');
// 선택된 탭의 data 값으로 content box를 선택함
$("#"+$(this).data('id')).addClass('on');
});
});
</script>
답변 3
어떤게 막혔다는거에요? 소스 그대로 따라하면 될건데..
<!-- 전체 리스트가 다 나오게 -->
data-id="all" 전체를 클릭하면
#all #con1 #con2 #con3 이 다 보이고싶어요!
소스 문제없어보이는데 어떤게 안되시는건가요?
all안에 con1 con2 con3의 내용을 다 불러오도록하는게 필요하신건가요?
네
<!-- 전체 리스트가 다 나오게 -->
data-id="all" 전체를 클릭하면
#all #con1 #con2 #con3 이 다 보이고싶어요!
답변있어서 채택할것도없는데..삭제도 못하네요
답변을 작성하시기 전에 로그인 해주세요.
