日本門戶網(wǎng)站的經(jīng)典選項卡導航_菜單導航特效

來自日本門戶網(wǎng)站的一款CSS+JavaScript選項卡導航菜單，銀灰色風格，看來日本人和中國人的審美是接近的，都喜歡這種風格，如果你要用的話，直接拷貝代碼部分到你的網(wǎng)頁中，注意你需要修改編碼才行，日本的編碼和中國可是不一樣哦。

<HTML>
<HEAD>
<title>日本門戶網(wǎng)站的經(jīng)典選項卡導航</title>
<style type="text/css"> 
*{margin:0; padding:0;}
body{
	padding:0;
	margin:0;
	font-size:8pt;
	_font-size:x-small;
	color:#333;
	background:#FFF;
	line-height:1.3em; 
	word-break:break-all;
}
#TabNews{
width:403px; padding:0; min-height:260px; border: 1px solid rid;
margin:39px;
}
#News-navi{background:url(http://p1.mb5u.com/texiao/1/bg_navi.gif) 0 100% no-repeat;background-color:#FFFFFF !important;	width:405px;}
#News-navi li{float:left; list-style:none;}
#News-navi #News01{width:102px;}
#News-navi #News02{width:76px;}
#News-navi #News03{width:76px;}
#News-navi #News04{width:76px;}
#News-navi #News05{width:75px;}
#News-navi a{background:url(http://p1.mb5u.com/texiao/1/bg_navi.gif) 0 0 no-repeat;padding-top:1px;display:block;line-height:1.1;min-height:22px;_height:23px;text-align:center;}
#News-navi a span{display:block;padding:3px 0 0;}
#News-navi #News01 a{background-position:0 0;}
#News-navi #News02 a{background-position:-102px 0;}
#News-navi #News03 a{background-position:-178px 0;}
#News-navi #News04 a{background-position:-254px 0;}
#News-navi #News05 a{background-position:-330px 0;}
#News-navi .focus a{font-weight:bold;color:#333333;}
#News-navi #News01.focus a{background-position:-405px 0;}
#News-navi #News02.focus a{background-position:-507px 0;}
#News-navi #News03.focus a{background-position:-583px 0;}
#News-navi #News04.focus a{background-position:-659px 0;}
#News-navi #News05.focus a{background-position:-735px 0;} 
#News .news-mrc .dot li,#News .news-mrc .dot dd{padding-bottom:3px;}
#News .news-mrc .dot li a,#News .news-mrc .dot dd a{padding-left:10px;}
#News .more-mrc .dot li a,#News .more-mrc .dot dd a{background-position:-196px -546px;padding-left:6px;}
#News{ min-height:238px;_height:238px; width:403px;border:1px solid #c4c4c4;margin-bottom:10px;border-top:none; background:#FFF;}
#News .pkg{width:393px; padding: 5px;}
#News .arrR{background-position:-187px -298px;}
#News #cocoCeleb{width:187px;}
#News .news-mrc{width:206px; line-height:1.4;}
#News .more-mrc{width:190px;}
#News .new{ background-position:1px -140px;*background-position:1px -142px;}
</style>
<SCRIPT type="text/javascript" >
function $()
{var C=new Array();for(var B=0;B<arguments.length;B++)
{var A=arguments[B];
if(typeof A=="string")
{if(document.getElementById){A=document.getElementById(A)}else{if(document.all){A=document.all(A)}}}if(arguments.length==1){return A}C.push(A)}return C};
function tabclick(A)
{if($("News0"+A).className!="focus")
{settab(A);saveCookie("ntab",A,200);return false}}
function settab(A)
{
	for(i=1;i<6;i++)
	{
		if(i==A)
		{$("News0"+i).className="focus";$("newsArea0"+i).style.display="block"}else{$("News0"+i).className="";$("newsArea0"+i).style.display=			"none"}
	
	}}
function saveCookie(D,E,B)
{var C=arguments.length>2?B:"200";var A=new Date();A.setTime(A.getTime()+1000*60*60*24*(C));var F=A.toGMTString();document.cookie=D+"="+escape(E)+"; expires="+F+"; path=/;"}
</SCRIPT>
 </HEAD>
<BODY>
<div id="TabNews">
	<UL id="News-navi" class="pkg">
<LI id="News01" class="focus"><A href="#" hidefocus="true" onclick="return tabclick(1);" ><SPAN>Codes</SPAN></A></LI>
<LI id="News02" class=""><A href="#" hidefocus="true"  onclick="return tabclick(2);" ><SPAN>ASP</SPAN></A></LI>
<LI id="News03" class=""><A href="#" hidefocus="true"  onclick="return tabclick(3);" ><SPAN>PHP</SPAN></A></LI>
<LI id="News04" class=""><A href="#" hidefocus="true"  onclick="return tabclick(4);" ><SPAN>JSP</SPAN></A></LI>
<LI id="News05" class=""><A href="#" hidefocus="true" onclick="return tabclick(5);" ><SPAN>DELPHI</SPAN></A></LI>
</UL><DIV class="box hslice" id="News">
 <DIV id="newsArea01" class="pkg pddT10" style="display: block; ">
<a href="#" target="_blank">那個年少輕狂的年代，已經(jīng)一去不回！</a>
</DIV>
<DIV id="newsArea02" class="pkg pddT10" style="display: none; ">
			<a href="#" target="_blank">ASP</a>
			</DIV>
			<DIV id="newsArea03" class="pkg pddT10" style="display: none; ">
			<a href="#" target="_blank">PHP</a></DIV>
			<DIV id="newsArea04" class="pkg pddT10" style="display: none; ">
			<a href="#" target="_blank">Jsp</a>			</DIV>
		 <DIV id="newsArea05" class="pkg pddT10" style="display: none; ">
			<a href="#" target="_blank">Delphi</a>
			</DIV>
		</DIV>
		</div>
		</div>
</BODY>
</HTML>

所屬頻道：菜單導航特效/更新時間：2011-02-24

[收藏][報錯][返回列表]

相關菜單導航特效：

菜單導航特效Rss訂閱特效代碼搜索

菜單導航特效推薦

猜你也喜歡看這些

相關鏈接：
復制本頁鏈接| 搜索日本門戶網(wǎng)站的經(jīng)典選項卡導航
特效說明：
菜單導航模板-日本門戶網(wǎng)站的經(jīng)典選項卡導航。

日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

日本門戶網(wǎng)站的經(jīng)典選項卡導航_菜單導航特效

菜單導航特效Rss訂閱特效代碼搜索

菜單導航特效推薦

猜你也喜歡看這些