动感的炫彩导航菜单代码

2024-09-05 12:19:15

字体：大中小

来源：转载

供稿：网友

动感的炫彩导航菜单代码，用JS控制颜色变换，鼠标放上去会有渐变效果，像一个FLASH菜单一样，很漂亮。

<html><head><style>/* 先把这个 xmenu 的样式放到css里 */.xmenu td{font-size:12px;font-family:verdana,arial;font-weight:bolder;color:#f5f5f5;border:1px solid #0066cc;background:#0066cc;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='#FEBD20'; //这是鼠标移上去时的背景颜色					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><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>炫彩变色菜单</title></head><body><table class="xmenu" id="xmenu0" width="500" cellpadding="1" cellspacing="2" border="0" bgcolor="#003366" align="center">	<tr>		<td>广告特效</td>		<td><font color="#FFFFFF">图片特效</font></td>		<td>CSS特效</td>		<td>网页特效</td>		<td>网页布局</td>		<td>综合代码</td>	</tr></table><script>attachXMenu(xmenu0); //动作绑定,xmenu0就是table的id</script></body></html>

上一篇：一个很实用的下拉导航条代码

下一篇：带渐变效果的变色导航菜单