jQuery的hover()方法(笔记)
因为mouseover和mouseout经常一起写,所以出现了hover()
hover(function(){},function(){});第一个参数为鼠标移入运行的函数,第二个为鼠标离开运行的函数
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<style type="text/css">
#demo{width:200px; height:300px;background-color: green;}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {
// $("#demo").mouseover(function(){
// $(this).css({"width":"400px","height":"600px","background-color":"yellow"});
// });
// $("#demo").mouseout(function(){
// $(this).css({"width":"200px","height":"300px","background-color":"green"});
// });
$("#demo").hover(function() {
$(this).css({"width":"400px","height":"600px","background-color":"yellow"});
}, function() {
$(this).css({"width":"200px","height":"300px","background-color":"green"});
});
});
//也可以使用简化的hover
/*一般用这个比较多,鼠标进入离开都执行这个函数。
$("ul").hover(function(){
$(".lei").toggle();
});
*/
</script>
</head>
<body>
<div id="demo"></div>
</body>
</html>
jQuery的hover()方法(笔记)的更多相关文章
- jQuery的hover方法搭配css的hover选择器,实现选中元素突出显示
问题简述: 今天做帮一个师姐做网页遇到一个这样的要求: 鼠标不移动进表格,表格透明度不变. 鼠标移动进表格,hover到的单元格透明度不变,没hover到的单元格透明度改变. 先贴我已经实现好的效果, ...
- JQUERY写大图轮播;附jquery的hover()方法、animate()方法、find()方法
思想:黑框设置超出部分隐藏. 红框往左移动,通过判断红框左边框距离黑框左边框的像素值,来实现红框的移动. 绿框在最上层,放每张图片的说明和序号. 一:html部分(大框.图片部分.箭头部分.图片介绍部 ...
- Jquery的hover方法让鼠标经过li时背景变色
来源地址:http://itfish.net/article/29790.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...
- 【jquery】hover方法
方法名称:hover(over, out) 概述:当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数.当鼠标移出这个元素时,会触发指定的第二个函数. 参数: 1) overFunction 鼠标 ...
- jQuery用unbind方法去掉hover事件及其他方法介绍
近日项目开发十分的繁忙,其中一个需求是实现响应式导航.(响应式的问题我们在css相关的博客中再交流) 大家都知道导航是需要下来菜单效果的,必然就会用到 jQuery的 hover() 方法.若是导航放 ...
- jQuery的live()方法对hover事件的处理示例
hover([over,]out) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数. 当鼠标移出这个元素时,会触发指定的第二个 ...
- 使用jQuery的hover事件在IE中不停闪动的解决方法
在使用jQuery的hover事件时,经常会因为鼠标滑动过快导致菜单不停闪动的情况,相信很多朋友都遇到过自己做的纵向下拉菜单不停的收缩,非常的讨厌.今天在给一个网站设计菜单时也遇到了这个情况,结果在百 ...
- Jquery hover方法使用及 mouseenter与mouseleave和 mouseover与mouseout的区别
定义和用法 hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数. jQuery 1.7 版本前该方法触发 mouseenter 和 mouseleave 事件. jQuery 1.8 ...
- jQuery中hover方法和toggle方法使用指南
jQuery提供一些方法(如:toggle)将两种事件效果合并到一起,比如:mouseover.mouseout:keyup.keydown等 1.hover函数 hover(over,out)一个模 ...
随机推荐
- 编程工具篇——Vim
配置 配置文件位于:/etc/vim/vimrc(添加配置在文件末尾输入代码即可) 常用配置 配色方案 :colorscheme ron(其中ron为我的配色方案,也可以选择其他,软件中自带配色文件全 ...
- perl 升级到5.20版本
不建议先rm 先下载tar.gz ...然後手动安装..default 安装到/usr/local/目录下.. 然後修改/usr/bin/perl的symbolic link到/usr/local/b ...
- https://repo1.maven.org/maven2/com/github/,开源软件清单list
Index of /maven2/com/github/ ../ 0312birdzhang/ 26-Jun-2015 07:21 - 120011676/ 22-Mar-2016 11:16 - 1 ...
- applet部署,无需修改客户端设置。
1 开发applet程序,编译成jar包 2 给jar包做数字签名: (1).用keytool生成密钥: keytool -genkey -keystore myapplet.keystore - ...
- 什么是xss盲打
什么是xss盲打? 盲打仅仅是一种惯称的说法,就是不知道后台不知道有没有xss存在的情况下,不顾一切的输入xss代码在留言啊,feedback啊之类的地方,尽可能多的尝试xss的语句与语句的存在方式, ...
- 2.&与&&以及位运算符。
这是单独的一块,因为一条讲不清楚(虽然内容也不够一篇),而且我之前也没好好弄清楚,所以有必要写出来. 说位运算符也是从&与&&(|与||类似)之间的区别讲起的.事实上,对于两个 ...
- Windows下安装storm-0.9.1
Windows下安装storm-0.9.1的详细步骤如下: 1.确定已经正确安装JDK1.6或JDK1.7(具体安装步骤略) 2.安装Python2.7版本(测试storm-starter proje ...
- JavaScript之数组学习
在JavaScript中,数组用关键字Array来声明.声明数组的同时还可以指定数组初始元素的大小,也就是数组的长度;下面代码定义了一个数组长度为6的数组; var beatles=Array(6); ...
- <%=id%>是什么意思
<%=% > 这里可以绑定后台的一个PUBLIC变量 <% % > 如果没有等号 可以在里面写C#语句
- 2014.9.15HTML
<html> <title> </title> ——页面标题 <head> </head> ——网页上的控制信息 <body> ...