zoukankan      html  css  js  c++  java
  • 20121110 jQuery hover 与 mouseover 与mouseout 的区别

    以前一直以为在jquery中其实mouseover和mouseout两个事件等于hover事件。但这两个并不能等同。

     

    <div class="wrapper">
    < div class="img"></div>
    < div class="text"></div>
    < /div>
    < div class="point"></div>

    在wrapper上加事件,当鼠标移动到wrapper上的时候让class="point"的层放大。但如果用mouseover和 mouseout事件的话,当鼠标移动到wrapper层后,point层会变大,
    但当鼠标在img和text层之间进行移动的时候,point层会变大变小,不停的变化。这并不是我们想要的结果,我们想要的是只要鼠标在wrapper层上,
    无论是img还是text上,point就变大,但在鼠标未移出 wrapper层的情况下,point层不变小。

    慢慢思路也清晰了,我们不用mouseover和mouseout而用hover问题就解决了。

    这么简单的问题我们竟然花了好长时间才解决,真是夸张。写篇日志以作纪念。

    补充:jquery源码中有这么一段:

    hover: function( fnOver, fnOut ) {
    return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
    }

    也就是说hover!= mouseover+mouseout。但hover=mouseenter + mouseleave

  • 相关阅读:
    django -- 信号
    django缓存设置
    django-debug-toolbar 插件的使用
    scrapy基本操作流程
    scrapy框架持久化存储
    scrapy基础
    phantomJS,谷歌无头浏览器, 模拟登陆qq空间
    python爬虫--selenium
    pytorch掉坑记录:model.eval的作用
    numpy常用函数
  • 原文地址:https://www.cnblogs.com/boyice/p/2764064.html
Copyright © 2011-2022 走看看