微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

本文实例分析了jQuery中hover与mouSEOver和mouSEOut的区别。分享给大家供大家参考,具体如下:

以前一直以为在jquery中其实mouSEOver和mouSEOut两个事件等于hover事件。两个没什么区别,应该是一样的。但昨天一个动画效果才让我见识了,这两个并不能等同。

rush:xhtml;">

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

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

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

补充:后来我师父说其实在jquery源码中有这么一段:

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

也就是说hover!=mouSEOver+mouSEOut。但hover=mouseenter+mouseleave。

希望本文所述对大家jQuery程序设计有所帮助。

原文地址:https://www.jb51.cc/jquery/50913.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐