|
|
| 鼠标触发型导航菜单 |
| 整理：Cnwshow.Com 来源：Internet 整理时间：2008-5-11 |
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>鼠标触发型导航菜单</title>
<style type="text/css">
<!--
.ww1 {width:500px;background-color:#D1E7FC;border-top:1px solid #9EC9EC;border-left:1px solid #9EC9EC;}
.ww1 td {border-right:1px solid #9EC9EC;border-bottom:1px solid #9EC9EC;height:28px;text-align:center;width:125px;font-size:12px;cursor:hand;}
.ww1 td.s {border-bottom:1px solid #FFFFFF;font-weight:bold;background-color:#FFFFFF;}
.ww2 {width:500px;border-right:1px solid #9EC9EC;border-top:none;border-left:1px solid #9EC9EC;border-bottom:1px solid #9EC9EC;font-size:12px;}
.ww2 a:link {color:#00007f;text-decoration:none;}
.ww2 a:visited {color:#800080;text-decoration:none;}
.ww2 a:hover {color:#00007f;text-decoration:underline;}
.ww2 a:active {color:#00007f;text-decoration:underline;}
.dis {display:block}
.undis {display:none}
-->
</style>
<script>
function getNames(obj,name,tij)
{
var p = document.getElementById(obj);
var plist = p.getElementsByTagName(tij);
var rlist = new Array();
for(i=0;i<plist.length;i++)
{
if(plist[i].getAttribute("name") == name)
{
rlist[rlist.length] = plist[i];
}
}
return rlist;
}
function butong_net(obj,name)
{
var p = obj.parentNode.getElementsByTagName("td");
var p1 = getNames(name,"f","div");
for(i=0;i<p1.length;i++)
{
if(obj==p[i])
{
p[i].className = "s";
p1[i].className = "dis";
}
else
{
p[i].className = "";
p1[i].className = "undis";
}
}
}
</script>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" class="ww1">
<tr>
<td class="s" onmouseover="butong_net(this,'butong_net1')">中国个人网页秀</td>
<td onmouseover="butong_net(this,'butong_net1')">网页菜单1</td>
<td onmouseover="butong_net(this,'butong_net1')">网页菜单2</td>
<td onmouseover="butong_net(this,'butong_net1')">网页菜单3</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" class="ww2">
<tr>
<td height="60" align="center">
<div id=butong_net1>
<div class=dis name="f">
<a href="http://www.cnwshow.com/cnw/show_1.htm" target="_blank">个人网站</a> <a href="http://www.cnwshow.com/cnw/show_3.htm" target="_blank">个人网页</a> <a href="http://www.cnwshow.com/cnw/show_2.htm" target="_blank">WAP网页</a> <a href="http://www.cnwshow.com/html/1_1.htm" target="_blank">网页特效</a> <a href="http://www.cnwshow.com/html/2_1.htm" target="_blank">网页知识</a>
</div>
<div class=undis name="f">
<a href="#" target="_blank">在线html编辑器</a> <a href="#" target="_blank">在线CSS编辑器</a> <a href="#" target="_blank">网页颜色选择器</a> <a href="#" target="_blank">滚动条颜色生成器</a>
</div>
<div class=undis name="f">
<a href="#" target="_blank">弹出窗口生成器</a> <a href="#" target="_blank">页面过渡效果生成器</a> <a href="#" target="_blank">网页加密解密工具</a>
</div>
<div class=undis name="f">
<a href="#" target="_blank">文本繁简体转换工具</a> <a href="#" target="_blank">汉字转换成拼音工具</a> <a href="#" target="_blank">文字加密解密工具</a>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
|
|
|
|
|
|
