mouseover和mouseout闪烁问题
在父级元素上注册了mouseover和mouseout事件后,当鼠标移动到子元素上时,会触发父级的mouseout和mouseover事件,反复触发,形成闪烁。
原因: 一种是由于冒泡,子级的mouseover和mouseout触发了父级的mouseover和mouseout,一种是不明原因,也会造成这个现象。
解决方法:
1. setTimeout,类似于debounce处理
$('div').mouseout(function(){
clearTimeout(t);
t=setTimeout(zoomIn,400);
}).mouseover(function(){
if(t!=null)clearTimeout(t);
t=null;
}
);
2.使用jquery的mouseenter和mouseleave代替,或者使用jquery的hover方法来处理。hover方法是对mouseenter和mouseleave的封装,而mouseenter和mouseleave则是对mouseover和mouseout的封装,进行了srcElement的判断,忽略子元素的行为。
mouseover和mouseout闪烁问题的更多相关文章
- jquery的mouseover和mouseout闪烁问题
$(document).ready(function(){ $(".anli").hover( function(){ var $div = $(this); t = setInt ...
- jQuery中mouseover和mouseout冒泡产生闪烁问题
问题:在jQuery中,对元素绑定mouseover和mouseout事件时,每次移入移出该元素和子元素时,都会触发事件,从而会出现闪动的现象. 原因:浏览器的冒泡行为. 解决方案: 使用mousee ...
- mouseover和mouseout多次触发解决方法(兼容ie和firefox)(转)
在用到mouseover和mouseout事件来作为事件触发的条件,但是如果我们用做触发的元素内部有其他的元素的时候当鼠标移上的时候会反复的触发mouseover和mouseout事件,如导致菜单闪烁 ...
- mouseover,mouseout,mouseenter,mouseleave的区别
相信做前端开发的都听说过“冒泡型事件”吧,<JavaScript高级程序设计>第九章有详细的讲述,但是,在学习的时候一知半解,也没详细去理解,导致最近在工作中碰到了问题:有许多 li 标签 ...
- 鼠标 mouseover和mouseout事件
在div内想实现鼠标移入移出效果,最开始的时候是用了jquery的mouseout和mouseover事件来实现的, $('.product).mouseover(function(){ …… }). ...
- mouseover和mouseout、mouseenter和mouseleave
又一个傻傻分不清楚的东东~ 现实真是一个问题天天有的世界~本以为我对js中的事件还是比较了解的,对于早就接触的mouse事件,更是觉得得心应手了~但是现实却给了我一记重拳! 我自身工作中遇到的犯二的故 ...
- mouseover、mouseout,mouseenter、mouseleave区别
心情压抑的一天,我想好好的. mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件. 只有在鼠标指针穿过被选元素时,才会触发 mouseen ...
- mouseenter(fn)和mouseleave、mouseover和mouseout的的区别
$('.box1').mouseenter(function(){//穿入事件mouseenter $(this).css('background','red'); }).mouseleave(fun ...
- hover和mouseover,mouseout的区别
说道hover和mouseover,mouseout的区别,不得不联系到mouseenter,mouseleave. mouseover,mouseout是指鼠标指针在穿过/离开被选元素或其子元素时触 ...
随机推荐
- Django基础 - Debug设置为False后静态文件获取404
当设置setting.py文件当中的DEBUG=FALSE后,Django会默认使用Web Server的静态文件处理,故若没设置好Web Server对静态文件的处理的话,会出现访问静态文件404的 ...
- Page Security
参见开发文档 Overview This document describes how to build applications that grant selected access to indi ...
- pandas 数据索引与选取
我们对 DataFrame 进行选择,大抵从这三个层次考虑:行列.区域.单元格.其对应使用的方法如下:一. 行,列 --> df[]二. 区域 --> df.loc[], df.ilo ...
- 深入浅出jsonp
前言 第一次听说jsonp,其实早在2年之前.当时在做一个活动页面的抽奖模块,要从服务端get一个概率,当时什么都不懂,同事说用ajax,我就用ajax,同事说dataType改成jsonp,我就改成 ...
- Nodejs学习笔记(三)--- 模块
目录 简介及资料 自定义模块 创建一个自定义模块 调用自定义模块 exports和module.exports 区别 exports和module.exports 覆盖 其它... 简介及资料 通过N ...
- Beta版本冲刺总结
小组:The Expendables 本来这篇Beta版本的冲刺总结应该在演示前就要写的,但在演示前的几天我们小组还在对一些功能进行反复的测试和修改,所以就将冲刺总结延后再写. 一.项目预期计划 改进 ...
- JavaScript、CSS、JSP 实现用户注册页面与信息校验
参考:http://blog.csdn.net/fightfaith/article/details/50277337 需求:实现用户注册页面并作出逻辑校验.要求: (1)完成注册页面样式如下: (2 ...
- new-nav-html
<header id="masthead" class="masthead" role="banner"> <h1 cla ...
- python IO文件处理
python的文件读写操作符有:r w a r+ w+ rb wb 除了以file的方式打开文件,还有一种方式就是open了,两个的用法是一模一样的,可以看成open就是file的别名 下面这个表格是 ...
- 【BZOJ 3196】二逼平衡树 线段树套splay 模板题
我写的是线段树套splay,网上很多人写的都是套treap,然而本蒟蒻并不会treap 奉上sth神犇的模板: //bzoj3196 二逼平衡树,支持修改某个点的值,查询区间第k小值,查询区间某个值排 ...