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. 2014.8.15模拟赛【公主的工作】&&bzoj1046[HAOI2007]上升序列

    bzoj题目是这样的 Description 对于一个给定的S={a1,a2,a3,…,an},若有P={ax1,ax2,ax3,…,axm},满足(x1 < x2 < … < xm ...

  2. Pasha and Phone(思维)

    Pasha and Phone time limit per test 1 second memory limit per test 256 megabytes input standard inpu ...

  3. 在SQL Server中如何快速查找DBCC命令和语法?

    DBCC命令非常好用,但是命令很多语法就很多,如何快速记忆呢?是否都要背下来.其实不用,只要能知道每个命令的作用并且记住DBCC HELP命令就可以了. --查找所有的DBCC命令 DBCC  HEL ...

  4. 【线段树成段更新-模板】【HDU1698】Just a Hook

    题意 Q个操作,将l,r 的值改为w 问最后1,n的sum 为多少 成段更新(通常这对初学者来说是一道坎),需要用到延迟标记(或者说懒惰标记),简单来说就是每次更新的时候不要更新到底,用延迟标记使得更 ...

  5. c# 委托内部构造

    以下纯属个人简介,错误之处,请随意指出. 委托是指向方法的,而事件是委托的触发器,执行事件,就会遍历委托里的方法,并且执行. 委托内部构造第一块是方法指针(methodPtr),用于指向方法的内存地址 ...

  6. 如何:控制命名空间前缀 (C#) (LINQ to XML)

    Visual Studio 2010 本主题介绍在序列化 XML 树时如何控制命名空间前缀. 在很多情况下,不需要控制命名空间前缀. 但是,某些 XML 编程工具需要命名空间前缀的特定控制. 例如,您 ...

  7. 【noip2012提高组】国王游戏

    恰逢 H 国国庆,国王邀请 n 位大臣来玩一个有奖游戏.首先,他让每个大臣在左.右 手上面分别写下一个整数,国王自己也在左.右手上各写一个整数.然后,让这 n 位大臣排 成一排,国王站在队伍的最前面. ...

  8. c++对文件操作的支持(二)

    #include <stdio.h> #include <iostream> #include <fstream> using namespace std; voi ...

  9. Magnolia-CMS安装配置

    Magnolia-CMS安装配置 Magnolia-CMS安装配置 介绍:Magnolia 是一个开源基于Java的Web内容管理系统(CMS),构建在Java内容知识库标准(JSR-170).它适合 ...

  10. Eclipse选中变量名,相同变量都变色显示 的设置

    ava文件的设置"Window"-"preferences"-"Java"-"Editor"-"Mark Oc ...