pc端hover事件 移入pop间隔时间处理
来源:互联网 发布:阿拉伯人 性 知乎 编辑:程序博客网 时间:2024/06/13 12:47
问题描述:
一个按钮,hover触发弹层跟随显示事件,来回在两个目标点移动,弹层来回消失出现问题
解决思路:
加一个定时器,在鼠标移出这个按钮和弹层一定事件后再触发关闭弹层事件;
代码如下
.hide{ display: none;}<a class="j_button"></a><div class="pop hide" ></div>var init = new Object({ init: function() { var _this = this; _this.pop(); //按钮 }, pop: function() { var _btn = $('.j_button'), _btimer; _btn.hover(function() { if (_btimer) { clearTimeout(_btimer); $(_btn).next().addClass('hide'); } $(this).next().removeClass('hide'); }, function() { var _this = this; _btimer = setTimeout(function() { $(_this).next().addClass('hide'); }, 500); }); $('.j_button').next().hover(function() { if (_btimer) { clearTimeout(_btimer); } }, function() { var _this = this; _btimer = setTimeout(function() { $(_this).addClass('hide'); }, 500); }); } }); init.init();
阅读全文
0 0
- pc端hover事件 移入pop间隔时间处理
- hover事件1,鼠标移入改变css样式
- hover事件延迟处理方法
- :hover 鼠标移入,切换图片
- 移动端模仿pc的hover技巧
- jQuery-bind不能处理绑定hover事件
- 嵌套的多个hover事件处理
- hover事件2,鼠标移入一个标签使其子级标签的css样式发生改变,显示可见
- hover事件
- 鼠标移入移出事件
- 鼠标移入移出事件
- jQuery – 鼠标经过(hover)事件的延时处理
- jQuery 的 live() 方法对 hover 事件的处理
- jQuery 的 live() 方法对 hover 事件的处理
- jQuery 的 live() 方法对 hover 事件的处理
- jQuery – 鼠标经过(hover)事件的延时处理
- jQuery 的 live() 方法对 hover 事件的处理
- 间隔时间
- 使用git拉取线上
- css里的动画animate应用
- fatal error LNK1112: 模块计算机类型“X86”与目标计算机类型“x64”冲突——我的解决方案
- 关于ALUA详解
- 应用:udp聊天器
- pc端hover事件 移入pop间隔时间处理
- monkey基础学习
- (3)RxJava2+Retrofit2+OkHttp3系列(RxJava2-3)
- IP输入框-基于Jquery
- thinkphp+redis+队列
- LMS.Falancs.v2.13-ISO 1CD(疲劳寿命分析软件)
- Ubuntu下给U盘分区
- 利用SecureCRT在windows与linux服务器之间利用ftp进行文件的上传下载
- C++二叉树的前序建立与前中后遍历