完全用Js输出的Tab选项卡_菜单导航特效

缂備礁娲﹂埅绀慹deCMS閻熸瑥妫濋。鍫曞极濞嗘垟鏌�濞戞梹澹嗛埞鏍⒒閿燂拷缂佸鍠愬﹢鍥礉閳ヨ櫕鐝� 闂侇偄顦辩紞澶屾兜閺囨氨闉嶉柤杈ㄦ缁憋拷 闁哄啰濮撮崪鏍博濞嗘挻姣愮€规悶鍎遍崣锟�,闁谎勫劤鐎规娊寮堕崘顔兼濞戞挴鍋撻梺娆惧枛閸欏繘寮婚敓锟�!

完全用Js输出的Tab选项卡，具体一点来说，就是用JavaScript的innerHTML输出的HTML代码，这个要看用途了，一般我们不这样弄，不过假如是在调用JS文件的时候，这个就派上用场了。

<title>完全用Js输出的Tab选项卡</title>
<style type="text/css"> 
#div {
font-size:9pt;	
width:360px;
}
.div_01{
	border:1px solid #FFFFFF;
	background-color:#3366CC;
	width:60px;
	height:30px;
	float:left;
	color:#FFFFFF;
}
#div_02 {
	border:1px solid #000000;
	width:360px;
	height:300px;
}
</style>
<center>
<div id="div">
	<div class="div_01" id="d1" onclick="run(this.id)">asp</div>
	<div class="div_01" id="d2" onclick="run(this.id)">php</div>
	<div class="div_01" id="d3" onclick="run(this.id)">jsp</div>
	<div class="div_01" id="d4" onclick="run(this.id)">cgi</div>
	<div class="div_01" id="d5" onclick="run(this.id)">vc</div>
	<div class="div_01" id="d6" onclick="run(this.id)">图像</div>
	<div id="div_02">初始化</div>
</div>
<Script type="text/JavaScript"> 
var oHTML=[
"<a href=\"#\">asp</a>",
"<a href=\"#\">php</a>",
"<a href=\"#\">jsp</a>",
"<a href=\"#\">cgi</a>",
"<a href=\"#\">vc</a>",
"<a href=\"#\"><center><img src=http://www.mb5u.com/images/logo.gif style='border:6 red groove;filter:fliph;'><span style='width:234;height:33;'></a>"]
function run(obj){
	for(i=1;i<=6;i++)
	{
		eval("document.getElementById(\"d"+i+"\").style.backgroundColor=\"#3366cc\"");
		document.getElementById(obj).style.backgroundColor="#FF0000";
	}
	document.getElementById("div_02").innerHTML=oHTML[obj.split("")[1]*1-1];
}
</Script>

所属频道：菜单导航特效/更新时间：2012-11-05

[收藏][报错][返回列表]

评论加载中....

完全用Js输出的Tab选项卡_菜单导航特效

菜单导航特效Rss订阅特效代码搜索

菜单导航特效推荐

猜你也喜欢看这些

闁衡偓閹増顥�&闁告帒妫旈棅锟�