|
|
| 经典实用的触发型导航菜单 |
| 整理：Cnwshow.Com 来源：Internet 整理时间：2008-6-10 |
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>经典实用的触发型导航菜单</title>
<style type=text/css>
.sec1 {BORDER-RIGHT: gray 1px solid; BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; CURSOR: hand; COLOR: #000000; BORDER-BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR: #eeeeee;}
.sec2 {BORDER-RIGHT: gray 1px solid; BORDER-TOP: #ffffff 1px solid; FONT-WEIGHT: bold; BORDER-LEFT: #ffffff 1px solid; CURSOR: hand; COLOR: #000000; BACKGROUND-COLOR: #d4d0c8;}
.main_tab {BORDER-RIGHT: gray 1px solid; BORDER-LEFT: #ffffff 1px solid; COLOR: #000000; BORDER-BOTTOM: gray 1px solid; BACKGROUND-COLOR: #d4d0c8;}
</style>
</head>
<body>
<SCRIPT language=javascript>
function secBoard(n) {
for(i=0;i<secTable.cells.length;i++)
secTable.cells
[i].className="sec1";
secTable.cells[n].className="sec2";
for(i=0;i<mainTable.tBodies.length;i++)
mainTable.tBodies
[i].style.display="none";
mainTable.tBodies
[n].style.display="block";
}
</SCRIPT>
<TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>
<TBODY>
<TR align=middle height=20>
<TD class=sec2 onMouseOver=secBoard(0) width="10%">菜单一</TD>
<TD class=sec1 onMouseOver=secBoard(1) width="10%">菜单二</TD>
<TD class=sec1 onMouseOver=secBoard(2) width="10%">菜单三</TD>
<TD class=sec1 onMouseOver=secBoard(3) width="10%">菜单四</TD>
</TR>
</TBODY>
</TABLE>
<TABLE class=main_tab id=mainTable height=240 cellSpacing=0 cellPadding=0 width=549 border=0>
<!--菜单一内容-->
<TBODY style="DISPLAY: block">
<TR>
<TD vAlign=top align=middle>
<TABLE cellSpacing=0 cellPadding=40 width=490 border=0>
<TBODY>
<TR>
<TD><a href="http://www.cnwshow.com/html/4_1.htm" target="_blank">网页特效 - 窗口特效</a></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
<!--菜单二内容-->
<TBODY style="DISPLAY: none">
<TR>
<TD vAlign=top align=middle>
<TABLE cellSpacing=0 cellPadding=40 width=490 border=0>
<TBODY>
<TR>
<TD><a href="http://www.cnwshow.com/html/5_1.htm" target="_blank">网页特效 - 页面特效</a></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
<!--菜单三内容-->
<TBODY style="DISPLAY: none">
<TR>
<TD vAlign=top align=middle>
<TABLE cellSpacing=0 cellPadding=40 width=490 border=0>
<TBODY>
<TR>
<TD><a href="http://www.cnwshow.com/html/6_1.htm" target="_blank">网页特效 - 鼠标特效</a></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
<!--菜单四内容-->
<TBODY style="DISPLAY: none">
<TR>
<TD vAlign=top align=middle>
<TABLE cellSpacing=0 cellPadding=40 width=490 border=0>
<TBODY>
<TR>
<TD><a href="http://www.cnwshow.com/html/7_1.htm" target="_blank">网页特效 - 技巧特效</a></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</body>
</html>
|
|
|
|
|
|
