说道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. Common Linux log files name and usage--reference

    reference:http://www.coolcoder.in/2013/12/common-linux-log-files-name-and-usage.html if you spend lo ...

  2. NET开发必备工具之-LINQPad

    第一步,下载:http://www.linqpad.net/ 第二步,安装 第三步,打开LINQPad 第四步,添加链接 第五步,输入SQL Server,用户名,密码 第六步,点击OK,成功链接 第 ...

  3. jquery 请求apache solr 跨域解决方案

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

  4. 智能 RPC框架 (C++)

    RPC中文叫远程函数调用,它是一种通信方式,只是看起来像普通的函数调用. 它包括三个基本要素: 1:服务端注册相应的(服务)函数(用于调用方调用) 2:调用方通过函数调用的方式将一些信息和参数打包到消 ...

  5. 【开源项目13】Volley框架 以及 设置request超时时间

    Volley提供了优美的框架,使android程序网络访问更容易.更快. Volley抽象实现了底层的HTTP Client库,我们不需关注HTTP Client细节,专注于写出更加漂亮.干净的RES ...

  6. android网络请求库volley方法详解

    使用volley进行网络请求:需先将volley包导入androidstudio中 File下的Project Structrue,点加号导包 volley网络请求步骤: 1. 创建请求队列     ...

  7. 使用SourceTree

    SourceTree是个git的GUI软件. 教程将“使用Git”那个小节可视化,更为直观. 第一次启动的时候选择忽略,然后直接进入界面.  填入git地址与注册邮箱即可 例如mindset这本书的g ...

  8. 【递归】数字三角形 简单dp

    [递归]数字三角形 题目描述 对于大多数人来说,“我们是这么的正常,因此也就这么的平庸.”而天才总是与众不同的,所以当邪狼问修罗王:“老大,你蹲在那儿一动不动看了有半个小时了,蚂蚁有那么好看吗?” 修 ...

  9. hdu 4714 树形DP

    思路:dp[i][0]表示第i个节点为根的子树变成以i为一头的长链最小的花费,dp[i][0]表示表示第i个节点为根的子树变成i不是头的长链最小花费. 那么动态方程也就不难想了,就是要分几个情况处理, ...

  10. 转: Android基于HLS和RTMP协议的第三方SDK选择

    转自: http://isunxu.xyz/android/between-rtmp-and-hls-third-party-choice/ 协议的详解网上资料都太多了,我就不赘述了.Android上 ...