js中hover事件时候的BUG以及解决方法
2024-09-25 17:42:03
hover事件是我们在开发前段时候遇到的稀松平常的问题,但是有没有发现会出现有一个BUg,比如,你移动到一个元素上,让它执行一个方法,然后你快速的移入移出的时候,他会进行亮瞎你眼睛的频闪效果,而且跟得了老年痴呆一样会进行延时显示,24K钛合金也会被闪瞎的,鼠标重复在相应区域滑动的时候,动画会一直执行,直到和鼠标经过的次数相同位置。比如鼠标移进3次,移出3次,动画就会出现三次。这显然是极度影响用户体验的。然后我们公司大后端告诉我说把mouseevent和monseleave合并成一个hover事件,还义正言辞的告诉我这是问题的所在(堂堂大前端竟然被后端的教育了,过分),然而我合并之后并没有什么卵用(啪啪的打脸),我就记得这是hover的不同写法罢了。好了,不闲扯了,开始说说自己的解决方法:
刚开始我想到的是事件冒泡或者事件捕获,由于我用的是dom结构是li里面包裹ul,所以就想到了事件捕获,那就去阻止事件捕获吧,
e.stopPropagation()
依旧闪,而且并没有解决。所以不是这个原因,那就从源头阻止 方法一:延迟误操作插件-hoverIntent 下载地址:http://www.jq22.com/jquery-info274
这个插件可以很好的解决这种Bug,防止误操作,兼容各个浏览器,包括恶心的IE6,良心推荐 方法二:jq的stop方法 在你的动画前面加一个stop()即可,我当时项目需要写的是slideup(),所以应该这样写
$("dom").stop(false,false).fadeUp()
完美解决!!!!
最新文章
- (一)Spark简介-Java&;Python版Spark
- @import与link
- openurl 跳转
- [moka同学笔记]一、Yii2.0课程笔记(魏曦老师教程)
- ThinkPHP 分页实现
- fprintf与fwrite函数用法与差异
- jdbc 连接 oracle rac
- GSM、3G、LTE、4G
- 判断线段和直线相交 POJ 3304
- Executor 和Executors
- 微信中web页面实现和公众号中查看图片一样的效果
- hdu2059 龟兔赛跑
- JAVA连接ACCESS、MYSQL、SQLSEVER、ORACLE数据库
- shell脚本中单双引号疑惑
- 【防坑指南】nginx重启后出现[error] open() “/usr/local/var/run/nginx/nginx.pid” failed
- 上下文管理器——with语句的实现
- 一个简单的";RPC框架";代码分析
- hdu4289 Control 最大流最小割
- ctags简易用法
- python2除法保留小数部分