返回首页
设为首页
收藏本站
菜单导航
鼠标按钮
文本图像
时间日期
游戏娱乐
状态栏类
广告特效
综合特效
站长工具
热门关键字 :
mssql
在线备份
百度搜索
关闭
滚动说明
链接
智能
标题
当前位置：
特效代码站
>
文本图像
> 正文
单元格背景色随鼠标响应变色的特效
来源：
www.texiao.org.cn
作者：
cheney
时间：
08-02-26
点击：
在FF中点击的效果会有些问题，当点击第一行单元格变色，点击第二个时第一个颜色不恢复原来无色的状态．<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>单元格背景色鼠标响应</title> <script language="javascript"> <!-- var aTDClick=new Array(3); function onColor(td,n) { if(!aTDClick[n-1]){ td.style.backgroundColor='#FFFF99'; td.style.color='#0600FF'; }else{ td.style.backgroundColor='#FF6699'; td.style.color='#0600FF'; } } function onClickColor(td,n) { switch(n) { case 1: if(aTDClick[0]!==true){ td.style.backgroundColor='#FF6699'; td.style.color='#0600FF'; aTDClick[0]=true; }else{ TR1.style.backgroundColor=''; TR1.style.color=''; aTDClick[0]=false; } TR2.style.backgroundColor=''; TR2.style.color=''; TR3.style.backgroundColor=''; TR3.style.color=''; aTDClick[1]=false; aTDClick[2]=false; break; case 2: if(aTDClick[1]!==true){ td.style.backgroundColor='#FF6699'; td.style.color='#0600FF'; aTDClick[1]=true; }else{ TR2.style.backgroundColor=''; TR2.style.color=''; aTDClick[1]=false; } TR1.style.backgroundColor=''; TR1.style.color=''; TR3.style.backgroundColor=''; TR3.style.color=''; aTDClick[0]=false; aTDClick[2]=false; break; case 3: if(aTDClick[2]!==true){ td.style.backgroundColor='#FF6699'; td.style.color='#0600FF'; aTDClick[2]=true; }else{ TR3.style.backgroundColor=''; TR3.style.color=''; aTDClick[2]=false; } TR2.style.backgroundColor=''; TR2.style.color=''; TR1.style.backgroundColor=''; TR1.style.color=''; aTDClick[1]=false; aTDClick[0]=false; break; } } function offColor(td,n) { if(!aTDClick[n-1]){ td.style.backgroundColor=''; td.style.color=''; }else{ td.style.backgroundColor='#FF6699'; td.style.color='#0600FF'; } } --> </script> <style type="text/css"> <!-- .light { font: normal 9pt "宋体"; color: #000000; text-decoration: none; background: #FFFFFF; cursor: default; } .tdstyle { border: 1px dashed #0099CC; } --> </style> </head> <body> <table width="100%" border="0" cellspacing="4" cellpadding="0"> <tr id="TR1" class="light" onMouseOver="onColor(this,1);" onMouseOut="offColor(this,1);" onClick="onClickColor(this,1);"> <td class="tdstyle" height="25">第一行</td> </tr> <tr id="TR2" class="light" onMouseOver="onColor(this,2);" onMouseOut="offColor(this,2);" onClick="onClickColor(this,2);"> <td class="tdstyle" height="25">第二行</td> </tr> <tr id="TR3" class="light" onMouseOver="onColor(this,3);" onMouseOut="offColor(this,3);" onClick="onClickColor(this,3);"> <td class="tdstyle" height="25">第三行</td> </tr> </table> </body> </html> <!---------特效代码站提供www.texiao.org.cn----------->
[
标签:
单元格
,
背景色
,
鼠标
,
响应
,
变色
,
特效
]
[
打印
]
[
关闭
]
上一篇：
防止网页被采集的代码
下一篇：
快速闪烁的背景特效代码
本类最新
文字从天而降的特效
逐渐显示的文字
打字机样式的琢字显示的彩色文字
不停向上滚动的文本
全屏显示按钮代码
本类热门
实现div圆角的特效代码
仿flash幻灯的图片轮换显示特效
防止网页被采集的代码
实现网页自由布局的特效代码
文字从天而降的特效
相关代码
免费百度搜索代码
网页在线备份mssql的一段代码
一个精彩的在线迷宫游戏
你心中的她是什么性格
在线俄罗斯方块游戏
一个简单的数学测试
文字从天而降的特效
逐渐显示的文字
打字机样式的琢字显示的彩色文...
不停向上滚动的文本
经典推荐
免费百度搜索代码
网页在线备份mssql的一段代码
一个精彩的在线迷宫游戏
你心中的她是什么性格
在线俄罗斯方块游戏
文字从天而降的特效
打字机样式的琢字显示的彩色文...
鼠标右键添加收藏夹
防止网页被采集的代码
随网页滚动条上下移动的QQ网页...
热门关注
一款非常漂亮的标签切换似菜单...
智能化的动态按钮效果
经典实用的浮动菜单特效代码
奥运会开幕倒计时代码
可自由摆放的多极导航菜单
跳舞的机器人
常用的网页漂浮广告特效代码
很多人想要的在线播放视频的代...
点击按钮后打开一个可移动的层...
水平向上的多级导航菜单特效代...
