说道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的区别的更多相关文章

  1. jquery的hover mouseover mouseout mouseenter mouseleave的区别

    jquery的hover mouseover mouseout mouseenter mouseleave的区别 1.mouseover mouseout mouseover - 鼠标指针经过任何子元 ...

  2. Jquery hover方法使用及 mouseenter与mouseleave和 mouseover与mouseout的区别

    定义和用法 hover() 方法规定当鼠标指针悬停在被选元素上时要运行的两个函数. jQuery 1.7 版本前该方法触发 mouseenter 和 mouseleave 事件. jQuery 1.8 ...

  3. jQuery中hover与mouseover和mouseout的区别分析

    本文实例分析了jQuery中hover与mouseover和mouseout的区别.分享给大家供大家参考,具体如下: 以前一直以为在jquery中其实mouseover和mouseout两个事件等于h ...

  4. mouseover,mouseout和mouseenter,mouseleave的区别及适用情况

    在做类似于百度地图右下角,不同地图切换UI时,遇到了问题. 就是鼠标滑过的时候出现一个层,当鼠标滑到当前层的话mouseover和mouseout在低版本的浏览器会出现闪动的现象,最简单的那就是把mo ...

  5. 关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别

    轮播中大多会选择mouseover和mouseout  这个时候是没有任何问题的 但当遇到有css3动画的时候,会发现移入移出过快 动画还没加载完成就需要执行下一个动画,完了动画样式就错乱了. 这时候 ...

  6. ie8下$(document).on('mouseover mouseout','ul li',function(){})的bug

    $(document).on('mouseover mouseout','ul li',function(){ if (event.type == 'mouseover') {           c ...

  7. jQuery mouseover,mouseout事件多次执行的问题处理

    控制鼠标移上移下事件,在使用Jquery 的mouseover,mouseout事件时,元素内部含有其它元素,会造成该事件多次的触发的情况. 问题解析 在用到mouseover和mouseout事件来 ...

  8. mouseover&mouseout和mouseenter&mouseleave

    mouseenter&mouseleave: 进入被选元素触发,进入被选元素的子元素不会重复触发. mouseover&mouseout: 进入被选元素触发,从被选元素进入其子元素会再 ...

  9. jQuery因mouseover,mouseout冒泡产生的闪烁问题

    由于浏览器的冒泡行为.造成如果在一个DIV元素上同时定义了mouseover,mouseout的时候,当鼠标移动到DIV中的child子元素的时候,就会同时执行了两个操作mouseover和mouse ...

随机推荐

  1. python 复杂表达式,以及表单的处理

    d = { 'Adam': 95, 'Lisa': 85, 'Bart': 59 } def generate_tr(name, score): if score < 60: return '& ...

  2. C#基础--局部类型Partial

    局部类型 原本来在同一个命名(namespace)空间下  是不允许相同的类(class)名存在的  但是partial关键字可以允许在同一个namespace下有想通过的类名存在 写法 下面的两个不 ...

  3. Linux下redis安装与使用

         redis官网地址:http://www.redis.io/      最新版本:2.8.3      在Linux下安装Redis非常简单,具体步骤如下(官网有说明):      1.下载 ...

  4. Solr DIH dataconfig配置

    1. 配置文件data-config.xml定义了数据库的基本配置,以及导出数据的映射规则,即导出数据库表中对应哪些字段的值,以及对特定字段的值做如何处理 </pre><p>& ...

  5. velocity 随笔

    资源网站: http://wiki.apache.org/velocity/ http://velocity.apache.org/engine/releases/velocity-1.7/user- ...

  6. 3. Android框架和工具之 xUtils(BitmapUtils)

    1. BitmapUtils 作用: 加载bitmap的时候无需考虑bitmap加载过程中出现的oom和android容器快速滑动时候出现的图片错位等现象: 支持加载网络图片和本地图片: 内存管理使用 ...

  7. 如何创建sequence

    我用的是在oracle中的方法,在oracle中sequence就是所谓的序列号,每次取的时候它会自动增加,一般用在需要按序列号排序的地方. 1.Create Sequence 你首先要有CREATE ...

  8. Android小项目之四 自动更新检查的逻辑

    ------- 源自梦想.永远是你IT事业的好友.只是勇敢地说出我学到! ---------- 按惯例,写在前面的:可能在学习Android的过程中,大家会和我一样,学习过大量的基础知识,很多的知识点 ...

  9. java程序执行内存处理过程

    我们学习知识,不仅要知其然,还要知其所以然,你的工资必定和你学习的深度成正比. 在以往.net的学习过程中,我们了解了怎么去开发一个程序,并有了一定的开发经验,但是一个程序具体是怎么在内存中运行的呢? ...

  10. Netty4 自定义Decoder,Encoder进行对象传递

    首先我们必须知道Tcp粘包和拆包的,TCP是个“流”协议,所谓流,就是没有界限的一串数据,TCP底层并不了解上层业务数据的具体含义,它会根据TCP缓冲区的实际数据进行包的划分,一个完整的包可能会被拆分 ...