说道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. Golang学习 - strings 包

    ------------------------------------------------------------ strings 包与 bytes 包中的函数用法基本一样,不再赘述. 只对 R ...

  2. C/C++ unit testing tools (39 found)---reference

    http://www.opensourcetesting.org/unit_c.php API Sanity AutoTest Description: An automatic generator ...

  3. Linux 2.4调度系统分析--转

    http://www.ibm.com/developerworks/cn/linux/kernel/l-k24sch/index.html 杨沙洲 (pubb@163.net)国防科技大学计算机学院 ...

  4. 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 ...

  5. 如何让静态库中的可执行程序不调用的函数不链接进该可执行程序?(-ffunction-sections -Wl,--gc-sections)

    关键词: -Wl,--gc-sections   -ffunction-sections  链接  elf   库 有时我们会遇到这种情况,可执行程序需要链接一些静态库,但是静态库中的函数并没有全部使 ...

  6. Socket 之 同步以及异步通信

    用netstat侦听下端口状态 同步通信: 预定义结构体,同步通信没有多线程异步委托回调,所以无需预定义结构体 客户端Client: class Program { static void Main( ...

  7. linux_memcached_memcachedb

    三个区别 当你听到memcache与memcached时把它当做是一个东东就好了,尽管它们存在区别,但是这并不影响你对它们的运用及理解. “Memcache”它是一个自由和开放源代码.高性能.分配的内 ...

  8. MJ刷新控件MJRefreshFooterView上拉之后收不回来的解决办法

    修改MJRefreshFooterView.m文件中的这个方法 #pragma mark - 状态相关 #pragma mark 设置状态 - (void)setState:(MJRefreshSta ...

  9. 10 Interesting Linux Command Line Tricks and Tips Worth Knowing

    I passionately enjoy working with commands as they offer more control over a Linux system than GUIs( ...

  10. 基于JQuery的渐隐渐现轮播

    <div id="ads"> <div> <!--轮播图片--> <ul> <li><a href="# ...