1、定义样式

<style type="text/css">

.striped
       {
           background-color:red;
       }
 .over
 {
  background-color:#BEBEBE;
 }

2、定义事件

<script type="text/javascript">

$(document).ready(function(){

$("table tr:nth-child(even)").addClass("striped");   偶数行 变化

$("table tr:nth-child(odd )").addClass("striped");   奇数行 变化

$("tr").mouseover(function(){
     $(this).addClass("over");
    });
    
    $("tr").mouseout(function() {
     $(this).removeClass("over");
    });

});
 </script>

用jQuery实现鼠标在table上移动进行样式变化的更多相关文章

  1. jQuery实现鼠标放到图片上,放大图片

    <script src="../../Script/jquery-1.7.2.js" type="text/javascript"></scr ...

  2. [转]jquery 鼠标放在图片上显示图片的放大镜效果jqzoom_ev-2.3

    本文转自:http://blog.csdn.net/weizengxun/article/details/6768183 鼠标放在图片上显示图片的放大镜效果使用jqzoom实现,本例版本2.3 效果图 ...

  3. GridView固定行宽,自动换行,鼠标放在Table的Tr上变色

    //固定行宽table-layout:fixed;//自动换行word-break :break-all;word-wrap:break-wordGridView.Attributes.Add(&qu ...

  4. jQuery实现鼠标移上弹出提示框,移出消失

    <TD>里有一行数据 "那片笑声让我想起......"  假设超出规定长度将用......代替, 而现在要通过鼠标移动到......上 显示全部内容,移出则消失.如下图 ...

  5. jQuery实现鼠标划过展示大图的方法

    这篇文章主要介绍了jQuery实现鼠标划过展示大图的方法,实例分析了jQuery操作鼠标事件及图片处理的技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jQuery实现鼠标划过展示大图 ...

  6. CSS如何实现把鼠标放在行上整行变色

    CSS如何实现把鼠标放在行上整行变色: 在很多网站都有这样的效果,那就是当鼠标放在一个文章列表行的时候,此行就会显示与其他行不同的颜色,本站的文章列表也具有这样的效果,便于浏览者识别,非常人性化,下面 ...

  7. jQuery AJAX 网页无刷新上传示例

    新年礼,提供简单.易套用的 jQuery AJAX 上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...

  8. JavaScript与jQuery关于鼠标点击事件

    即实现鼠标点击其中一个菜单发生样式的改变,当点击下一个菜单时,当前菜单样式改变,其他菜单均变为之前样式. 用JavaScript,jQuery都可以实现,只是后者是封装的JavaScript库,具有s ...

  9. 浅谈CSS和JQuery实现鼠标悬浮图片放大效果

    对于刚刚学习网页前台设计的同学一定对图片的处理非常苦恼,那么这里简单的讲解一下几个图片处理的实例. 以.net为平台,微软的Visual Studio 2013为开发工具,当然前台技术还是采用CSS3 ...

随机推荐

  1. iOS/Xcode异常:reason = “The model used to open the store is incompatible with the one used to create the store”

    reason=The model used to open the store is incompatible with the one used to create the store 出现上述异常 ...

  2. C++之字符串分割函数split

    c++之字符串分割: /* *c++之字符串分割: */ #include <iostream> #include <string> #include <vector&g ...

  3. VS2012 创建项目失败,,提示为找到约束。。。。

    首先查看 控制面板里已安装的更新 在Microsoft .NET Freamewofk 4.5 小 查看 是否有KB2833957和KB2840642这两个补丁(如下图)  如果有 卸载它 然后 下载 ...

  4. CodeForces 525C Ilya and Sticks 贪心

    题目:click here #include <iostream> #include <cstdio> #include <cstring> #include &l ...

  5. django 新闻编辑笔记

    url(r'^news_manage/edit/$',views.news_edit,name='edit') url配置 <a href="/management/news_mana ...

  6. Chapter 12 外观模式

    外观模式:为子系统中的一组接口提供一个一致的界面,此模式定义了一个高层接口,这个模式使得这一子系统更加容易使用. 外观模式三个阶段: 首先,在设计初期阶段,应该要有意识的将不同的两个层分离. 其次,在 ...

  7. 引用 模块编译Makefile模板

    本文转载自geyingzhen<模块编译Makefile模板>   引用 geyingzhen 的 模块编译Makefile模板 ifneq ($(KERNELRELEASE), ) // ...

  8. 基于visual Studio2013解决C语言竞赛题之0513字符拷贝

     题目 解决代码及点评 /************************************************************************/ /* 13. 将字符数 ...

  9. osgi实战学习之路:8. Service-3之ServiceTracker

    通过ServiceTracker能够对查找的Service进行扩展 以下的demo引入装饰器模式对Service进行日志的扩展 demo: Provider student-manage/Activa ...

  10. 【一】仿微信飞机大战cocos2d-x3.0rc1

    參考 [偶尔e网事] 的 [cocos2d-x入门实战]微信飞机大战  cocos2dx 2.0版本号,偶尔e网事他写的很具体,面面俱到,大家很有必要看下.能够通过以下链接跳转: cocos2d-x入 ...