非常精彩的导航菜单，推荐！--e天下网络

非常精彩的导航菜单，推荐！

[ 来路：时间：2007-9-15 12:07:32 点击： ]

非常精彩的导航菜单，推荐！

把如下代码复制到<body></body>之间

<table class="xmenu" id="xmenu0" width="500" cellpadding="1" cellspacing="4" border="0" bgcolor="#336699" align="center"> <tr> <td onclick="location.href='http://www.butong.net';">精彩网页特效Butong.net</td> <td>Name</td> <td>Is</td> <td>LeX</td> <td>Rus</td> <td>!!!</td> </tr> </table> <script>attachXMenu(xmenu0); //在上面这个table结束的地方执行事件动作的绑定, 这里的这个xmenu0就是那个table的id</script> <br><br><br><br>  <table class="xmenu" id="xmenu1" width="100" cellpadding="1" cellspacing="4" border="0" bgcolor="#336699" align="center"> <tr><td>My</td></tr> <tr><td>Name</td></tr> <tr><td>Is</td></tr> <tr><td>LeX</td></tr> <tr><td>Rus</td></tr> <tr><td>!!!</td></tr> </table> <script>attachXMenu(xmenu1);</script>

把如下代码复制到<head></head>之间

<style> /* 先把这个 xmenu 的样式放到css里 */ .xmenu td{font-size:12px;font-family:verdana,arial;font-weight:bolder;color:#ffffff;border:1px solid #336699;background:#336699;filter:blendtrans(duration=0.5);cursor:hand;text-align:center;} </style> <script> /* 这是把事件动作绑定到菜单上的函数 */ function attachXMenu(objid){ var tds=objid.getElementsByTagName('td'); for(var i=0;i<tds.length;i++){ with(tds[i]){ onmouseover=function(){ with(this){ filters[0].apply(); style.background='#66CCFF'; //这是鼠标移上去时的背景颜色 style.border='1px solid #ffffff'; //边框 style.color='black'; //文字颜色 filters[0].play(); } } onmouseout=function(){ with(this){ filters[0].apply(); style.background='#336699'; //这是鼠标离开时的背景颜色 style.border='1px solid #336699'; //边框 style.color='#ffffff'; //文字颜色 filters[0].play(); } } } } } </script>

使用说明：代码中有横、坚两个导航菜单，两个菜单的代码在代码中有注释，选择你需要的，在<body></body>代码区将另一个菜单的代码删掉即可，菜单的内容和链接在<body></body>代码区可以自行更改，增加或减少只需按代码中的样式更改。菜单中鼠标移上的颜色和鼠标移开时的颜色可以在<head></head>代码修改，代码中有注释，也可以使用图片作为背景，只需将其中的颜色代码改为 url(图片名称) 即可。<body></body>代码区的bgcolor="#336699"为表格默认的背景颜色，当然也可以使用图片作为背景，改为 background="图片名称" 即可。

：：：：站长友情提示：多花一分钟学点什么都好：：：：

上一篇：没有了下一篇：简洁的双级导航菜单，推荐！

：：热点信息：：

= = 免责声明 = =

① 欢迎转载我网所刊信息，请注明“来源：E天下网络”。
② 凡本网注明“来源：XXX（非E天下网络）”的作品，均转载自其它媒体，转载目的在于传递更多信息，并不代表本网赞同其观点和对其真实性负责。如因作品内容、版权和其它问题需要同本网联系的，请在30日内进行。
※联系方式：Airtofly@163.com

：：推荐文章：：

Win 2000中DNS服务器的设置

：：视频教程：：

Photoshop	Dreamweaver
Flash MX	Fireworks
Office	AutoCAD
FrontPage	CORELDRAW