广告也精彩

XP菜单网页特效

[作者：佚名 | 来源：本站整理 | 发布时间：2008-2-4 9:52:34 | 收藏本文 ] 【大中小】

以下是原始代码,点击运行即可演示特效!

<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>
 
<table class=xmenu id=xmenu0 cellSpacing=4 cellPadding=1 width=500 align=center bgColor=#336699 border=0>

<tr>
<td>My 
<td>Name 
<td>Is 
<td onclick="location.href='http://www.alixixi.com'">LeX 
<td>Rus 
<td>!!! </tr></table>
<SCRIPT>attachXMenu(xmenu0); //在上面这个table结束的地方执行事件动作的绑定, 这里的这个xmenu0就是那个table的id</SCRIPT>

<tr>
<td>My 
<tr>
<td>Name 
<tr>
<td>Is 
<tr>
<td onclick="location.href='http://www.alixixi.com'">LeX 
<tr>
<td>Rus 
<tr>
<td>!!! </tr></table>
<SCRIPT>attachXMenu(xmenu1);</SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

Tages: xp 菜单 [返回上一页][打印]

上一篇：已经没有了下一篇：显示隐藏的导航菜单

文章评论

评论内容只代表网友观点，与本站立场无关！查看更多评论

相关信息

广告也精彩

推荐文章

热门文章

XP菜单网页特效

文章评论