0
아래는 내가 사용한 코드입니다. 기본 탭은 빨간색으로 표시된 tab1입니다. 두 번째 탭이 선택되었을 때 두 번째 탭이 선택되었을 때 첫 번째 탭이 첫 번째 탭 색상을 제거하는 활성 괜찮나은 여전히 http://jsfiddle.net/JE3e5/12/jquery를 사용하여 다른 탭이 활성화되어있을 때 기본 활성 탭 색상을 제거하는 방법
<ul class="rtabs">
<li class="active-first"rel="tab1"> <span>Tab1</span></li>
<li rel="tab2"> <span>Tab2</span></li>
<li rel="tab3"><span> Tab3</span></li>
<li rel="tab4" class="last"> <span>Tab4</span></li>
</ul>
<div class="tab_container">
<div id="tab1" class="tab_content">
<p><img src="images/cod.jpg"> <br />
<strong>
Call of Duty: Black Ops bears the series' standard superbly,
delivering an engrossing campaign and exciting competitive multiplayer.
</strong>
</p>
</div>
CSS
.rtabs { list-style:none; position:relative;padding:0px; margin:20px 0px; font-size:0px; background:#FFF; width:639px; height:29px; display:block; }
.rtabs li { cursor:pointer;list-style:none; padding:7px 13px; margin:0px; height:15px; display:inline-block; background:#000; zoom:1; *display: inline; border- right:1px solid #000; }
.rtabs li rel { cursor:pointer;color:#FFF; font-weight:bold; font-size:13px; text-transform:uppercase; }
.rtabs li span { color:#BBB; font-weight:bold; font-size:13px; text-transform:uppercase; }
.rtabs li.first { background:red; padding-left:18px; }
.rtabs li.last { background:#000; padding-right:18px; border-right:0px; }
.rtabs .active { background:red; }
.rtabs .active-last { background:red; padding-right:20px; border-right:0px;}
.rtabs .active-first { background:red; padding-left:20px; }
.tab_container {
border: 1px solid #999999;
border-top: none;
clear: both;
float: left;
width: 100%;
background: #FFFFFF;
}
.tab_content {
padding: 20px;
font-size: 1.2em;
display: none;
}
JQuery와
$(document).ready(function() {
$(".tab_content").hide();
$(".tab_content:first").show();
$("ul.rtabs li").click(function() {
$("ul.rtabs li").removeClass("active");
$(this).addClass("active");
$(".tab_content").hide();
var activeTab = $(this).attr("rel");
$("#"+activeTab).fadeIn();
});
});
[jquery로 클래스 추가 및 제거] (http://api.jquery.com/addClass/)에서 수행 할 수 있다고 생각합니다. –