B2B網站的滑動門，可以定義某個TAB是否滑動切換_菜單導航特效

B2B網站的滑動門，可以定義某一個TAB是否滑動切換，有時候我們需要讓某一個滑動門的菜單不滑動，有其它用途，你可以參考一下本代碼，本代碼原型是從一個B2B網站上扒下來的。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>滑動門 - www.wf0088.com </TITLE>
<META http-equiv=Content-Type mrc="text/html; charset=gb2312">
<STYLE type=text/css>
TD {
	FONT-SIZE: 14px; COLOR: #000; FONT-FAMILY: 宋體
}
A:link {
	COLOR: #3d362b
}
A:visited {
	COLOR: #3d362b
}
A:hover {
	COLOR: #f60
}
BODY #search {
	CLEAR: both; WIDTH: 540px; HEIGHT: 50px
}
BODY #search #left {
	FLOAT: left
}
BODY #search #searchleft {
	PADDING-LEFT: 30px; FLOAT: left; PADDING-TOP: 12px; HEIGHT: 35px; TEXT-ALIGN: left
}
BODY #search #searchleft1 {
	PADDING-LEFT: 30px; PADDING-TOP: 12px; HEIGHT: 35px; TEXT-ALIGN: left
}
FORM {
	PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
BODY #newsearch {
	WIDTH: 540px; HEIGHT: 30px
}
BODY #newsearchtop {
	WIDTH: 540px; HEIGHT: 25px; TEXT-ALIGN: right
}
BODY #newsearchtop LI {
	FONT-SIZE: 12px; FLOAT: left
}
.newsearchinsidew {
BORDER-TOP: #cccccc 1px solid; MARGIN-TOP: 2px; BORDER-LEFT: #ccc 1px solid; WIDTH: 70px; CURSOR: hand; LINE-HEIGHT: 21px; BORDER-BOTTOM: #cc3300 1px solid; HEIGHT: 23px; TEXT-ALIGN: center; TEXT-DECORATION: underline}
.newsearchinsider {/* www.wf0088.com */
BORDER-RIGHT: #cc3300 1px solid; BORDER-TOP: #cc3300 1px solid; FONT-WEIGHT: bold; BORDER-LEFT: #cc3300 1px solid; WIDTH: 70px; COLOR: #ffffff; PADDING-TOP: 5px; HEIGHT: 25px; BACKGROUND-COLOR: #ff7300; TEXT-ALIGN: center}
.newsearchinsider A:visited {
COLOR: #ffffff; TEXT-DECORATION: none
}
.newsearchinsidew A:hover {
background-color:#CCCCCC;WIDTH: 69px; TEXT-ALIGN: center
}
BODY #newsearchbottom {
	BORDER-RIGHT: #cc3300 1px solid; BORDER-LEFT: #cc3300 1px solid; BORDER-BOTTOM: #cc3300 1px solid; POSITION: relative; HEIGHT: 50px; BACKGROUND-COLOR: #ff7300;/* www.wf0088.com */
}
BODY #newsearchbottom #e1 {Z-INDEX: 0; LEFT: 0px; VISIBILITY: visible; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
BODY #newsearchbottom #e2 {Z-INDEX: 0; LEFT: 0px; VISIBILITY: hidden; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
BODY #newsearchbottom #e3 {Z-INDEX: 2; LEFT: 0px; VISIBILITY: hidden; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
BODY #newsearchbottom #e4 {Z-INDEX: 2; LEFT: 0px; VISIBILITY: hidden; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
BODY #newsearchbottom #e5 {Z-INDEX: 2; LEFT: 0px; VISIBILITY: hidden; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
BODY #newsearchbottom #e6 {Z-INDEX: 2; LEFT: 0px; VISIBILITY: hidden; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
BODY #newsearchbottom #e7 {Z-INDEX: 2; LEFT: 0px; VISIBILITY: hidden; WIDTH: 538px; POSITION: absolute; TOP: 0px; HEIGHT: 30px}
UL {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none}
</STYLE>
      <SCRIPT>
function doClick(o){
	 o.className="newsearchinsider";
	 var j;
	 var id;
	 var e;
	 for(var i=1;i<=7;i++){
	   id ="v"+i;
	   j = document.getElementById(id);
	   e = document.getElementById("e"+i);
	   if(id != o.id){
	   	 j.className="newsearchinsidew";
	   	 e.style.visibility = "hidden";
	   }else{
			e.style.visibility = "visible";
	   }
	 }
	 
	var id = o.id+""; 
	var dd=id.substring(1,2);
	var curForm = document.getElementById("FormSearch"+dd);
	var inputv ;
	for(var i=1;i<=7;i++){
	var otherForm = document.getElementById("FormSearch"+i);
	}
	
}
function doOut(o){
 
}
      </SCRIPT>
</HEAD>
<BODY>
<br><br>
      <DIV id=search>
        <DIV id=newsearch>
        <DIV id=newsearchtop>
        <UL>
<LI><DIV class=newsearchinsider id=v1 onClick="javascript:doClick(this)"><A href="/">供給信息</A></DIV></LI>
<LI><DIV class=newsearchinsidew id=v2 onClick="javascript:doClick(this)"><A href="#">求購信息</A></DIV></LI>
<LI><DIV class=newsearchinsidew id=v3 onMouseOver="javascript:doClick(this)"><A href="/">產品目錄</A></DIV></LI>
<LI><DIV class=newsearchinsidew id=v4 onMouseOver="javascript:doClick(this)"><A href="/">公司庫</A></DIV></LI>
<LI><DIV class=newsearchinsidew id=v5 onMouseOver="javascript:doClick(this)"><A href="/">貿易資訊</A></DIV></LI>
<LI><DIV class=newsearchinsidew id=v6 onMouseOver="javascript:doClick(this)"><A href="/">商人社區</A></DIV></LI>
<LI><DIV class=newsearchinsidew id=v7 onMouseOver="javascript:doClick(this)"><A href="/">拍賣信息</A></DIV></LI>	
</UL>
</DIV>
        <DIV id=newsearchbottom>
        <DIV id=e1><DIV id=left><DIV id=searchleft1>搜索 供給信息</DIV></DIV></DIV>
        <DIV id=e2><DIV id=left><DIV id=searchleft1>請輸進產品名關鍵字</DIV></DIV></DIV>
        <DIV id=e3><DIV id=left><DIV id=searchleft1>請輸進產品名關鍵字</DIV></DIV></DIV>
        <DIV id=e4><DIV id=left><DIV id=searchleft1>請輸進產品名或公司名關鍵字</DIV></DIV></DIV>
        <DIV id=e5><DIV id=left><DIV id=searchleft1>請輸進關鍵字</DIV></DIV></DIV>
        <DIV id=e6><DIV id=left><DIV id=searchleft1>請輸進關鍵字</DIV></DIV></DIV>
        <DIV id=e7><DIV id=left><DIV id=searchleft1>請輸進拍賣關鍵字</DIV></DIV></DIV></DIV></DIV>
      </DIV><DIV></DIV>   
</BODY>
</HTML>

所屬頻道：菜單導航特效/更新時間：2012-05-08

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

相關菜單導航特效：

B2B網站的滑動門，可以定義某個TAB是否滑動切換_菜單導航特效

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

菜單導航特效推薦

猜你也喜歡看這些