`
alan3258
  • 浏览: 68978 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

鼠标经过给tr换颜色

    博客分类:
  • js
阅读更多
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>鼠标经过给tr换颜色</title>	
</head>
<body>
<table align="center" width="100%" border="1" cellspacing="1" cellpadding="1" >
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20">&nbsp;123</td>
    <td height="20">&nbsp;abvx</td>
    <td height="20">&nbsp;465465</td>
    <td height="20">546654654</td>
  </tr>
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20">&nbsp;123</td>
    <td height="20">&nbsp;abvx</td>
    <td height="20">&nbsp;465465</td>
    <td height="20">546654654</td>
  </tr>    
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20">&nbsp;123</td>
    <td height="20">&nbsp;abvx</td>
    <td height="20">&nbsp;465465</td>
    <td height="20">546654654</td>
  </tr>
</table>
<script type="text/javascript">
function changeTrColor(obj){	
	var _table=obj.parentNode;
	for (var i=0;i<_table.rows.length;i++){
		_table.rows[i].style.backgroundColor="";
	}	
	obj.style.backgroundColor="blue";
}
</script>
</form>
</body>
</html>
0
0
分享到:
评论

相关推荐

    鼠标经过tr时,改变tr当前背景颜色

    鼠标经过给tr换颜色&lt;/title&gt; &lt;/head&gt;&lt;body&gt;”center” width=”100%” border=”1″ cellspacing=”1″ cellpadding=”1″&gt; &lt;tr xss=removed xss=removed&gt; ”center”&gt;1 

    table鼠标经过时整行变色 jquery

    table鼠标经过时整行变色 jquerytable鼠标经过时整行变色 jquery

    jsp中鼠标移动tr变色

    对于一些童鞋 在jsp中困然的鼠标移动变色的问题 如果底色没有设置的话鼠标移动时间可以解决但是由的设置了底色让人很头疼所以给写个解决方案 如果好用请给个好评谢谢

    HTML中实现鼠标经停时整行(tr)变色

    使用纯CSS实现在鼠标经过一个表格的某一行的时候,要整行的背景颜色发生变化,以表明该行正中焦点: &lt;html &gt; &lt;head&gt; &lt;meta charset=utf-8/&gt; &lt;title&gt;change&lt;/title&gt; &lt;style type=...

    响应鼠标变换表格背景或者颜色的代码

    响应鼠标变换表格背景或者颜色的代码 在前端开发中,响应鼠标变换表格背景或者颜色的代码是一个常见的交互效果。该效果可以通过使用JavaScript和HTML实现。下面将对该代码进行详细的解释和分析。 首先,让我们来看...

    jquery 实现鼠标单击行时,选中checkbox复选框

    jquery 实现鼠标单击行时,改变行的背景颜色,选中checkbox复选框

    js实现TAB切换对应不同颜色的代码

    本文实例讲述了js实现TAB切换对应不同颜色的代码。...这是一个个性化的TAB菜单,每个TAB卡片的背景颜色都不相同,鼠标点击上部的TAB,在主体内容区可看到颜色的变化。 运行效果截图如下: 在线演示地址如下: ...

    兼容ie和firefox的鼠标经过(onmouseover和onmouseout)实现--简短版

    "兼容IE和Firefox的鼠标经过(onmouseover和onmouseout)实现--简短版" 在本篇文章中,我们将探讨如何使用CSS和JavaScript来实现兼容IE和Firefox的鼠标经过效果(onmouseover和onmouseout)。在前端开发中,鼠标经过...

    JavaScript实现的鼠标响应颜色渐变效果完整实例

    本文实例讲述了JavaScript实现的鼠标响应颜色渐变效果。分享给大家供大家参考,具体如下: 运行效果图如下: 完整代码如下: &lt;!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN ...

    table行随鼠标移动变色示例

    ”body_div”&gt; ”tab”&gt; &lt;tr xss=removed&gt; 工号&lt;/th&gt; 姓名&lt;/th&gt; 年龄&lt;/th&gt; 性别&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;2014010101&lt;/td&gt; 张峰&lt;/td&gt; &lt;td&gt;56&lt;/td&gt; 男&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;2014010102&lt;/td&gt; 李玉&lt;

    JavaScript实现鼠标点击导航栏变色特效

    废话不多说了,直接给大家贴js实现鼠标点击导航栏变色代码,具体代码如下所示: &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;...

    js实现鼠标滑过文字链接色彩变化的效果

    本文实例讲述了js实现鼠标滑过文字链接色彩变化效果的方法。分享给大家供大家参考。具体实现方法如下: &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

    鼠标激活显示背景色网页特效CSS代码

    鼠标激活显示背景色,我们该如何编写这样的代码呢?我们来整理一下思路:把a里的部分设置成一个块元素,然后定义鼠标放上后的样式。CSS1中:hover只对a元素起作用,CSS2中:hover应用于所有元素.而IE7也没同样没有...

    js控制鼠标事件移动及移出效果显示

    鼠标事件的移动及移出效果都可以使用js来自定义,下面有个示例,效果为当事件发生改变时背景颜色也随着改变,适合新手朋友 &lt;style type=text/css&gt; .style0{ background-color:#FFFF00; } .style1{ background...

    纯CSS实现鼠标悬停提示的方法

    这是一款比较漂亮的鼠标悬停提示效果,用纯CSS代码实现,鼠标放到图片上会显示一个层,也就是悬停时的提示,在这个提示框内你还可以加入图片或是一个列表,这就靠你的发挥了,提示框的背景颜色和文字颜色你都可以...

    javascript简单实现表格行间隔显示颜色并高亮显示

    //存储tr对象的类名,当鼠标移开时进行恢复 function trcolor(){ //表格行颜色间隔显示 var tabNode = document.getElementsByTagName(“table”)[0]; var trNodes = tabNode.rows; for(var x=1;x&lt;trNodes....

    jQuery点击tr实现checkbox选中的方法

    实现的过程有点纠结,试了几次都没成,最后用了一个笨笨的方法,就是点击行的时候,让他的子元素(td)的背景颜色为红色.(因为我用到了光棒效果,如果我点击行(td)的时候,颜色是变了,但鼠标一离开的时候就又变回...

    Qt Creator 的安装和hello world 程序+其他程序的编写--不是一般的好

    13.按着鼠标左键将其拖到设计窗口上,如下图。 14.我们双击它,并将其内容改为helloworld。 15.我们在右下角的属性栏里将字体大小由9 改为15。 16.我们拖动标签一角的蓝点,将全部文字显示出来。 17.再次按下运行...

Global site tag (gtag.js) - Google Analytics