hover和mouseover,mouseout的区别
说道hover和mouseover,mouseout的区别,不得不联系到mouseenter,mouseleave。
mouseover,mouseout是指鼠标指针在穿过/离开被选元素或其子元素时触发。
mouseenter,mouseleave是指鼠标指针在穿过/离开被选元素时触发。
举个简单例子:
<div class="wapper">
<h1></h1>
<p></p>
</div>
<div class="buttom"></div>
当鼠标移动到wapper上时类名为buttom的div变大,鼠标离开时恢复原样。
我们使用mouseover,mouseout。当鼠标在<h1>和<p>标签之间来回移动时类名为buttom的div会不断变大,回复原样。
而mouseenter,mouseleave就不会出现这种情况。
而hover的效果等同于mouseenter,mouseleave。
hover和mouseover,mouseout的区别的更多相关文章
- jquery的hover mouseover mouseout mouseenter mouseleave的区别
jquery的hover mouseover mouseout mouseenter mouseleave的区别 1.mouseover mouseout mouseover - 鼠标指针经过任何子元 ...
- Jquery hover方法使用及 mouseenter与mouseleave和 mouseover与mouseout的区别
定义和用法 hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数. jQuery 1.7 版本前该方法触发 mouseenter 和 mouseleave 事件. jQuery 1.8 ...
- jQuery中hover与mouseover和mouseout的区别分析
本文实例分析了jQuery中hover与mouseover和mouseout的区别.分享给大家供大家参考,具体如下: 以前一直以为在jquery中其实mouseover和mouseout两个事件等于h ...
- mouseover,mouseout和mouseenter,mouseleave的区别及适用情况
在做类似于百度地图右下角,不同地图切换UI时,遇到了问题. 就是鼠标滑过的时候出现一个层,当鼠标滑到当前层的话mouseover和mouseout在低版本的浏览器会出现闪动的现象,最简单的那就是把mo ...
- 关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别
轮播中大多会选择mouseover和mouseout 这个时候是没有任何问题的 但当遇到有css3动画的时候,会发现移入移出过快 动画还没加载完成就需要执行下一个动画,完了动画样式就错乱了. 这时候 ...
- ie8下$(document).on('mouseover mouseout','ul li',function(){})的bug
$(document).on('mouseover mouseout','ul li',function(){ if (event.type == 'mouseover') { c ...
- jQuery mouseover,mouseout事件多次执行的问题处理
控制鼠标移上移下事件,在使用Jquery 的mouseover,mouseout事件时,元素内部含有其它元素,会造成该事件多次的触发的情况. 问题解析 在用到mouseover和mouseout事件来 ...
- mouseover&mouseout和mouseenter&mouseleave
mouseenter&mouseleave: 进入被选元素触发,进入被选元素的子元素不会重复触发. mouseover&mouseout: 进入被选元素触发,从被选元素进入其子元素会再 ...
- jQuery因mouseover,mouseout冒泡产生的闪烁问题
由于浏览器的冒泡行为.造成如果在一个DIV元素上同时定义了mouseover,mouseout的时候,当鼠标移动到DIV中的child子元素的时候,就会同时执行了两个操作mouseover和mouse ...
随机推荐
- Golang学习 - strings 包
------------------------------------------------------------ strings 包与 bytes 包中的函数用法基本一样,不再赘述. 只对 R ...
- 修改avd路径
1.比如你要把AVD放在D盘AndroidAVD下面,则预先在D盘下建立一个文件夹 AndroidAVD.必须的.不然设置了环境变量也没有用,因为模拟器不会自动创建该文件夹. 2.在桌面右击“我的电脑 ...
- PetaPoco使用要点
PetaPoco是一款适用于.Net 和Mono的微小.快速.单文件的微型ORM! 可以从这里获得PetaPoco: NuGet - http://nuget.org/List/Packages/Pe ...
- Android(java)学习笔记264:Android下的属性动画高级用法(Property Animation)
1. 大家好,在上一篇文章当中,我们学习了Android属性动画的基本用法,当然也是最常用的一些用法,这些用法足以覆盖我们平时大多情况下的动画需求了.但是,正如上篇文章当中所说到的,属性动画对补间动画 ...
- 函数参数选项的处理getopt getopt_long getopt_long_only
转载:http://blog.chinaunix.net/uid-20321537-id-1966849.html 在头文件中int getopt(int argc,char *argv[], c ...
- .net4.0中使用ODP.net访问Oracle数据库(无需安装oracle客户端部署方法)
1.在没有安装oracle客户端的设备上也能访问服务器上的oracle (通俗的讲就是:开发的应用程序 和 oracle数据库服务器分别在两台电脑上)2.不需要配置TnsNames.Ora文件 开发环 ...
- 非常棒的 「Sublime Text 配色/主题」与「编程字体」
*标有 CT 的是配色 **主题中调用的字体和相配套的Sublime主程序图标可访问GitHub获取 Afterglow https://github.com/YabataDesign/aftergl ...
- IO输入输出
编写TextRw.java的Java应用程序,程序完成的功能是:首先向TextRw.txt中写入自己的学号和姓名,读取TextRw.txt中信息并将其显示在屏幕上. package com.hanqi ...
- Discuz!图片查看插件(支持鼠标缩放、实际大小、旋转、下载)
Discuz!图片查看插件(支持鼠标缩放.实际大小.旋转.下载) 图片查看是网站中的常用功能,用于展示详细的图片.在discuz图片插件的基础上进行了改造,因此这篇文章主要从以下几个方面来讨论图片查看 ...
- hibernate的第一个程序
#建表语句 create database hibernate; use hibernate; create table user( id int primary key, name varchar( ...