CSS:
.clear{clear:both; Höhe:0px; overflow:hidden;}
.tab{width:400px; Schriftgröße:12px;}
.tab_menu ul{padding:0px;margin:0px;}
.tab_menu li{list-style:none; Anzeige:Block; float:left;
Hintergrund:#C2CEFE; Höhe:22px; Zeilenhöhe:22px;
Polsterung: 0px 8px; Rand rechts: 6px; Grenze:#86B4CA 1px fest;
}
.box{width:400px; Höhe:200px; Überlauf:versteckt; Grenze:#A8C9D9 1px fest; Polsterung: 10px 8px; }
.tab_menu ul li.selected{background:#dadada; Cursor:Zeiger; }
.hide{display:none;}
jQuery:
$(function() {
var $menu_li = $("div.tab_menu ul li"); //选取网页选项卡
$menu_li.click(function(){
$(this).addClass("selected") //当前
高亮
.siblings().removeClass("selected"); //去掉其它同辈的高亮
var index = $menu_li.index( $(this) ); //找到子节点的索引
$("div.tab_box > div").eq(index).show() //索引为N的DIV显示出来
.siblings().hide(); //其它的选项卡隐藏
})
})
html:
Stellungnahme:Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn