【jquery】hover方法
方法名称:hover(over, out)
概述:当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。
参数:
1) overFunction
鼠标移到元素上要触发的函数
2) outFunction
鼠标移出元素要触发的函数
例子:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标滑过效果</title>
<script src="http://files.cnblogs.com/ningvsban/jquery1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
//$("#orderedlist tbody tr").css("text-align","center");
$("#orderedlist tbody tr").css({"text-align":"center"});
$("#orderedlist tbody tr").hover(function() {
$(this).addClass("blue");
}, function() {
$(this).removeClass("blue");
});
});
</script>
<style>
.blue {
background:#bcd4ec;
cursor:pointer;
}
</style>
</head>
<body>
<table id="orderedlist" width="50%" border="0" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>QQ</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td>AAAA</td>
<td>20</td>
<td>1111</td>
<td>aaaa@gmail.com</td>
</tr>
<tr>
<td>BBBB</td>
<td>21</td>
<td>2222</td>
<td>bbbb@gmail.com</td>
</tr>
<tr>
<td>CCCC</td>
<td>22</td>
<td>333</td>
<td>cccc@gmail.com</td>
</tr>
</tbody>
</table>
</body>
</html>
</html>
效果图:
【jquery】hover方法的更多相关文章
- css hover伪类选择器与JQuery hover()方法
css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...
- Jquery hover方法使用及 mouseenter与mouseleave和 mouseover与mouseout的区别
定义和用法 hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数. jQuery 1.7 版本前该方法触发 mouseenter 和 mouseleave 事件. jQuery 1.8 ...
- jQuery hover() 方法
$("p").hover(function(){ $("p").css("background-color","yellow&qu ...
- jQuery CSS()方法改变CSS样式实例解析
转自:http://www.jbxue.com/article/24588.html 分享一个jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性.其中有一 ...
- jQuery的hover方法搭配css的hover选择器,实现选中元素突出显示
问题简述: 今天做帮一个师姐做网页遇到一个这样的要求: 鼠标不移动进表格,表格透明度不变. 鼠标移动进表格,hover到的单元格透明度不变,没hover到的单元格透明度改变. 先贴我已经实现好的效果, ...
- jquery 使用方法<转载>
jquery 使用方法 jQuery是目前使用最广泛的javascript函数库.据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库.微软公司 甚至把jQuery作为他们的官 ...
- mouseover 和 hover 方法
mouseover 和 hover 方法的不同?jquery hover包括了鼠标移到对象上,同时鼠标再移出对象的过程,相应的子类也被选中. mouseover是鼠标经过对象时,不包含他的子类同时 ...
- jQuery Ajax 方法调用 Asp.Net WebService 以及调用aspx.cs中方法的详细例子
一.jQuery Ajax 方法调用 Asp.Net WebService (引自Terry Feng) Html文件 <!DOCTYPE html PUBLIC "-//W3C//D ...
- jQuery 事件 方法
jQuery 事件方法 事件方法触发器或添加一个函数到被选元素的事件处理程序. 下面的表格列出了所有用于处理事件的 jQuery 方法. 方法 描述 bind() 向元素添加事件处理程序 blur() ...
- [转] jquery 使用方法
jquery 使用方法 jQuery是目前使用最广泛的javascript函数库.据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库.微软公司 甚至把jQuery作为他们的官 ...
随机推荐
- 数据库实例: STOREBOOK > 用户 > 编辑 用户: PUBLIC
ylbtech-Oracle:数据库实例: STOREBOOK > 用户 > 编辑 用户: PUBLIC 编辑 用户: PUBLIC 1. 一般信息返回顶部 1.1, 1.2, 2 ...
- 用C#代码编写的SN快速输入工具
一般软件都要输入序列号(SN),而大家平时用的最多的恐怕是盗版软件,通常盗版软件的序列号(SN)都保存成:XXXXX-XXXXX-XXXX-XXXX的形式. 而软件输入序列号的地方通常都是几个文本框( ...
- 【K8S】K8S-网络模型、POD/RC/SVC YAML 语法官方文档
K8S-网络模型.POD/RC/SVC YAML 语法官方文档 Kubernetes - Production-Grade Container Orchestration kubernetes/kub ...
- 基于Java spring框架的微信企业号开发中关于js-sdk的配置
在调用js-sdk的第一步,我们需要引入js-sdk的js链接,然后执行wx.config,官方示例如下所示: wx.config({ debug: true, // 开启调试模式,调用的所有api的 ...
- SSIS包部署错误之运行环境设置
在SQLServer代理处新建了一个job,步骤里面的操作是指向一个SSIS模型包 执行,报错如下 根据报错信息是64bit,于是做出修改如下图 再次执行 OK
- 【python】理想论坛爬虫长贴版1.00
理想论坛有些长贴,针对这些长贴做统计可以知道某ID什么时段更活跃. 爬虫代码为: #---------------------------------------------------------- ...
- 【C#】SQL数据库助手类1.0(自用)
using System; using System.Collections.Generic; using System.Text; using System.Configuration; using ...
- 。一个通俗易懂的HMM例子
原文链接地址:http://www.52nlp.cn/hmm-concrete-example-on-wiki/ Alice 和Bob是好朋友,但是他们离得比较远,每天都是通过电话了解对方那天作了什么 ...
- Jquery Types 小结
JavaScript provides several built-in(内置的) datatypes. In addition to those, this page documents virtu ...
- spring 中常用的配置项
1.spring 中常用的配置项 application.properties #端口 server.port=8081 #调试模式 debug=false #上下文 #一般情况下,小项目通常都是在t ...