1.通过使用onmouseover onmouseout方法
2.变色使用background-color(css)属性
3.变色的标签是td(tr仅仅能使用事件,颜色样式不起作用)
第一种方法 使用样式操作
<style>
.tr_color{
background-color:#ffffff;
} .tr_color_hover{
background-color:blanchedalmond;
}
</style>
<script type="text/javascript">
function mover(obj){
$(obj).children("td").each(function(){
$(this).removeClass("tr_color");
$(this).addClass("tr_color_hover");
}) }
function mback(obj){
$(obj).children("td").each(function(){
$(this).removeClass("tr_color_hover");
$(this).addClass("tr_color");
})}
</script>
<tr onmouseover="mover(this)" onmouseout="mback(this)">
<td height="18" class="tr_color">
</tr>


另外一种方法 直接对背景色操作
<script type="text/javascript">
function mover(obj){
$(obj).children("td").each(function(){
$(this).attr("bgColor","#eafcd5")
}) }
function mback(obj){
$(obj).children("td").each(function(){
$(this).attr("bgColor","#FFFFFF")
})}
</script>
<tr onmouseover="mover(this)" onmouseout="mback(this)">
<td height="18"bgColor="#FFFFFF">
</tr>

jQuery特效 隔行变色的更多相关文章

  1. JQuery实现隔行变色和突出显示当前行 效果

    运行效果如下图: jquery关键代码: <script type="text/javascript"> //该文件为:js.js // 当鼠标移到表格上是,当前一行背 ...

  2. jQuery 表格隔行变色插件

    jQuery提供了用于扩展jQuery功能的方法,即jQuery.fn.extend()方法和jQuery.extend()方法. 基本的JS框架代码如下: ;(function($) { $.fn. ...

  3. jQuery实现隔行变色、悬停变色 ( CSS3伪类选择器:nth-child() )

    <title>实现隔行变色</title> <script src="Js/jquery-1.8.0.min.js" type="text/ ...

  4. jQuery实现隔行变色

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. jquery table 隔行变色+点谁谁变色

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  6. jquery 全选、反选、获取值、背景行、隔行变色和鼠标略过变色变色全特效

    好久没有写东西了,当然不是没东西可写,只是没有时间写.今天抽出点时间来把我最近使用的一些 Javascript 特效的东西贴出来,供自己或者别人查询使用.最近我在做一个新的 B/S 系统,由于没有专门 ...

  7. jquery实现html表格隔行变色

    效果图 实现代码: 通过css控制样式,利用jquery的addClass方法实现 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Trans ...

  8. jquery插件之表格隔行变色并鼠标滑过高亮显示

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现表格隔行变色,且鼠标移动在表格的某一行上时,该行能高亮显示.整体代码如 ...

  9. 用JQuery实现表格隔行变色和突出显示当前行

    用JQuery实现表格隔行变色和突出显示当前行 上源码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "htt ...

随机推荐

  1. WindowProc和DefWindowProc的区别

    1. WindowProc是你给自己的窗口定义的窗口处理函数 DefWindowProc是windows平台提供的默认窗口处理函数 如果某些消息你不需要做特别的处理,调用DefWindowProc进行 ...

  2. OSCHina技术导向:Java全文搜索框架Lucene

    Lucene 是apache软件基金会一个开放源代码的全文检索引擎工具包,是一个全文检索引擎的架构,提供了完整的查询引擎和索引引擎,部分文本分析引擎.Lucene的目的是为软件开发人员提供一个简单易用 ...

  3. 一道来自华为的C机试题目

    题目是这样的 求一个字符串中连续字母的个数 比如I have a book. : 1 I have a dog. : 0 I haavee aa dogg : 4 #include <windo ...

  4. iOS开展UI一片—简单的浏览器观看节目

    iOS开发UI篇-简单的浏览器查看程序 一.程序实现要求 1.要求 2. 界面分析 (1) 须要读取或改动属性的控件须要设置属性 序号标签 图片 图片描写叙述 左边button 右边button (2 ...

  5. C#整理3——运算符和语句

    运算符: 一.算术运算符:+ - * / % ——取余运算 取余运算的应用场景:1.奇偶数的区分. 2.把数变化到某个范围之内.——彩票生成. 3.判断能否整除.——闰年.平年. using Syst ...

  6. timeout Timeout时间已到.在操作完成之前超时时间已过或服务器未响应

    Timeout时间已到.在操作完成之前超时时间已过或服务器未响应 问题 在使用asp.net开发的应用程序查询数据的时候,遇到页面请求时间过长且返回"Timeout时间已到.在操作完成之间超 ...

  7. 前端资料QQ群交流

    转:https://github.com/jsfront/src/blob/master/qq.md 这本来是我QQ群内部的一份公共约定的日常交流规则,后来得到大伙的一致认可,并用实际行动来捍卫它,使 ...

  8. Angular-UI-Router

      原文  http://www.cnblogs.com/youngdze/p/4025538.html 主题 路由器JavaScript 路由 Route 为什么用 Route AJAX 请求不会留 ...

  9. 玩转Android---事件监听篇---第2篇

    事件监听篇---第二篇 下面是各种常用控件的事件监听的使用 ①EditText(编辑框)的事件监听---OnKeyListener ②RadioGroup.RadioButton(单选按钮)的事件监听 ...

  10. linux常用命令详解 (一) 安装和登录命令

    Linux必学的60个命令   Linux提供了大量的命令,利用它可以有效地完成大量的工 作,如磁盘操作.文件存   Linux提供了大量的命令,利用它可以有效地完成大量的工作,如磁盘操作.文件存取. ...