특정 탭 링크값 설정
본문
현재 페이지 열었을 때 tab1이 기본값으로 설정되어있는데,
http:// 주소 맨 끝에 #tab2를 붙여 바로 2번탭으로 가는 링크를 생성하고싶은데요,
주소링크에 #tab2를 넣어도 그냥 기본값(1번탭)으로 연결됩니다ㅠㅜ
따로 값을 추가해야될까요? 고수님들 답변 부탁드립니다 ㅠㅠ!
<style type="text/css">
#container{max-width: 1200px; margin: 0 auto 0;}
ul.tab{list-style: none; max-width: 100%; margin: 0; padding: 0;}
ul.tab li{float: left; padding: 0; font-weight: 500; width: 50%;}
ul.tab li a{display: block; text-align: center; line-height: 100px; font-size: 18px; color: #fff; background: #422a18;}
ul.tab li a.selected{cursor: default; color: #222; background: #f5f2f2;}
ul.panel{clear: both; padding: 0;}
ul.panel li {list-style-type: none;}
</style>
<div id="container">
<div><img src="/data/w_header.jpg" alt=""></div>
<ul class="tab">
<li><a href="#tab1" class="selected">반가워요</a></li>
<li><a href="#tab2">고마워요</a></li></ul>
<ul class="panel">
<li id="tab1"><img alt="" src="/data/w_tab_01.jpg"></li>
<li id="tab2"><img alt="" src="/data/w_tab_02.jpg"></li></ul>
<div><img src="/data/w_footer.jpg" alt=""></div></div>
<script type="text/javascript">
$(function(){
$("ul.panel li:not("+$("ul.tab li a.selected").attr("href")+")").hide()
$("ul.tab li a").click(function(){
$("ul.tab li a").removeClass("selected");
$(this).addClass("selected");
$("ul.panel li").hide();
$($(this).attr("href")).show();
return false;
});
});
</script>
답변을 작성하시기 전에 로그인 해주세요.
