Jquery tab 页代码

代码写累了，休息一会，分享一段JQUERY 控制的 tab代码。 

<style>
	.tablist { font-size: 14px; *zoom: 1; }
	.tablist_bg{background-color:#edf3fb;}
	.tablist:after { display: table; content:''; clear:both; }
	.tab { float: left; }
	.tab_a:link,.tab_a:visited{ display: block; padding: .3em 1.5em; color:#333; text-decoration: none;margin-top:1px;color:#666;position:relative;bottom:-7px;border:1px solid #ddd;background:#efefef;}
	.tab_a:hover {color:#666;position:relative;bottom:-7px;border:1px solid #ddd;background:#efefef;}
	.tab_on, .tab_on:link,.tab_on, .tab_on:visited{background-color:#ffffff;color:#ff4136;padding: .5em 1.5em; position:relative;border:1px solid #ddd;border-bottom:1px solid #fff;bottom:-1px; font-weight:bold;}
	.tab_on, .tab_on:hover{background-color:#ffffff;font-weight:bold;padding: .5em 1.5em; color: #ff4136; position:relative;border:1px solid #ddd;border-bottom:1px solid #fff;bottom:-1px;}
	.tab_on .icon_index_jt, .tab_on:hover .icon_index_jt{ position:absolute;top:14px; right:-1px;width:8px;height:16px; background:url(../images/index/icon_index_jt.gif) no-repeat left top;}
	.tab_one .index_weixin{width:207px;height:212px; display:inline-block; background:url(../images/index/index_weixin.jpg) no-repeat left top; position:absolute; top:15px;left:0px;}
	.r_box_height{height: 286px;border:1px solid #edf3fb;}
</style>
<ul class="tablist bbd">
    <li class="tab ml10"><a href="#tabpanel1" class="tab_a tab_on tabNormal">左</a></li>
    <li class="tab ml10"><a href="#tabpanel2" class="tab_a tabNormal">右</a></li>
  
</ul>
<ul class="tab_content">
    <li id="tabpanel1" class="tabpanel">左</li>
	<li id="tabpanel2" class="tabpanel" style="display:none;">右</li>
</ul>
<script src="/jquery-powerSwitch.js" type="text/javascript" ></script>
<script>
$(".tabNormal").powerSwitch({
    classAdd: "tab_on"
})
</script>