漂亮的仿flash菜单,来自蓝色经典
漂亮的仿flash菜单,来自蓝色经典
发布时间:2016-12-29 来源:查字典编辑
摘要:/*先把这个xmenu的样式放到css里*/.xmenutd{font-size:12px;font-family:verdana,aria...

<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>

/*

http://lexrus.blueidea.com

这是把事件动作绑定到菜单上的函数

*/

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>

<>

<table id="xmenu0" width="500" cellpadding="1" cellspacing="4" border="0" bgcolor="#336699" align="center">

<tr>

<td><a href="http://www.lenvo.cn/">www.lenvo.cn</a></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 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>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类