很漂亮的鼠标经过色彩显示效果-JS特效-爱易网页

很漂亮的鼠标经过色彩显示效果

日期：2014-05-18　浏览次数：20500 次

以下是程序代码

<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>
/* 
<a href="http://lexrus.blueidea.com" target="_blank">http://lexrus.blueidea.com</a>
这是把事件动作绑定到菜单上的函数
*/
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" width="500" cellpadding="1" cellspacing="4" border="0" bgcolor="#336699" align="center">
 <tr>
  <td onclick="location.href='http://www.aiyiweb.com';">点击我看看时候效果</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>

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

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

相关资料更多>

靠谱分析：6月发生的WWDC和谷歌I/O大会，将会出现哪些新产品？

百度“全网寻人”面前的互联网信息枢纽价值

让一让，小米4来了，碰见米粉请务必绕道走！

快播灭了，还有西瓜：视频网站的灰色江湖还在

微博启动自媒体计划粉丝+收入双激励是亮点

戴尔新CEO名单曝光:惠普甲骨文高管在列

清点：罗永浩推锤子ROM 小米打法遭模拟

银河证券王锦炎：金融业如何使用大数据

二代 iPad Air将配备2GB内存？为同屏多任务做准备

香港全能空间香港高速云虚拟主机PHP/ASP/NET送MSSQL和MYSQL

推荐阅读更多>