탭메뉴 링크 클릭시 탭메뉴 고정시키려면
본문
아래 탭메뉴를 인터넷에서 찾아서 사용하고 있습니다.
A를 클릭시 보이는 메뉴를 클릭시에는 A상태가 유지됩니다.
B를 클릭후 보이는 메뉴를 클릭시에는 B가 유지되지 않고 A로 돌아가 버립니다.
어떻게 수정을 해주면 되나요??
(아래 원본 소스는 탭메뉴가 3개 이지만
3번째는 지우고 현재 2개만 사용하고 있습니다.)
<script type="text/javascript">
$(function () {
tab('#tab',0);
});
function tab(e, num){
var num = num || 0;
var menu = $(e).children();
var con = $(e+'_con').children();
var select = $(menu).eq(num);
var i = num;
select.addClass('on');
con.eq(num).show();
menu.click(function(){
if(select!==null){
select.removeClass("on");
con.eq(i).hide();
}
select = $(this);
i = $(this).index();
select.addClass('on');
con.eq(i).show();
});
}
</script>
<ul class="tab" id="tab">
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
<div class="tab_con" id="tab_con">
<div>1st Contents</div>
<div>2nd Contents</div>
<div>3rd Contents</div>
</div>
답변 1
<ul class="tab" id="tab">
<li onclick="tab('#tab', 0)">A</li>
<li onclick="tab('#tab', 1)">B</li>
<li onclick="tab('#tab', 2)">C</li>
</ul>
이렇게 해보시면 될 것 같습니다.
감사의 인사가 늦었습니다. 답변주셔서 감사드립니다.
많은 분들이 알려주신대로 해도 안되는거을 보니
아무래도 탭메뉴가 들어간 부분인 화면상 보이는 왼쪽부분의
다른 태그의 영향을(?) 받는것 같습니다.
