JQ的hover事件拓展

编写原因:当鼠标滑过某个带有hover事件的元素,但是仅仅是路过,并不是希望查看此部分内容的时候,效果不理想

$.fn.extend({
delayed : function(fn1,fn2,time){
time = time || 150
var _this = this; _this.delayedTimer = null;
return $(this).mouseenter(function(){
clearTimeout(_this.delayedTimer);
_this.delayedTimer = setTimeout(function (){
fn1.call(_this);
},time)
}).mouseleave(function(){
clearTimeout(_this.delayedTimer);
_this.delayedTimer = setTimeout(function (){
fn2.call(_this);
},time)
})
}
})

用法和hover基本一样,但是此方法目前无法针对多个元素,但是添加起来应该也不费劲

hover事件优化(延时操作)的更多相关文章

  1. 鼠标经过(hover)事件的延时处理

    关于鼠标hover事件及延时 鼠标经过事件为web页面上最常见的事件之一.简单的hover可以用CSS :hover伪类实现,复杂点的用js. 一般情况下,我们是不对鼠标hover事件进行延时处理.但 ...

  2. jQuery – 鼠标经过(hover)事件的延时处理

    一.关于鼠标hover事件及延时 鼠标经过事件为web页面上非常常见的事件之一.简单的hover可以用CSS :hover伪类实现,复杂点的用js. 一般情况下,我们是不对鼠标hover事件进行延时处 ...

  3. 2.linux系统基础笔记(延时操作、实时系统中的定时器、事件)

    延时操作 延时操作是操作系统中经常遇到的一种情形.延时的原因很多,有的时候是为了等待外设芯片处理结束,有的时候是为了暂时释放cpu的使用权,有的就是为了希望在一段时间获取资源,如果没法在单位时间内获取 ...

  4. js中hover事件时候的BUG以及解决方法

    hover事件是我们在开发前段时候遇到的稀松平常的问题,但是有没有发现会出现有一个BUg,比如,你移动到一个元素上,让它执行一个方法,然后你快速的移入移出的时候,他会进行亮瞎你眼睛的频闪效果,而且跟得 ...

  5. bootstrap中的dropdown组件扩展hover事件

    bootstrap的下拉组件,需要点击click时,方可展示下拉列表.因此对于喜欢简单少操作的大家来说,点击一下多少带来不便,因此,引入hover监听,鼠标经过自动展示下拉框.其实在bootstrap ...

  6. 分享一个jquery插件,弥补一下hover事件的小小不足

    hover事件有一个缺点:当你的鼠标无意划过一个dom元素(瞬间划过,这个时候用户可能不想触发hover事件),会触发hover事件 应该设置一个时差来控制hover事件的触发 比如jd左边的菜单 你 ...

  7. jquery事件和动画操作集锦

    一,事件 1,加载事件 1 2 3 4 5 6 $(document).ready(function(){   //todo }); //dom准备就绪后执行ready里面的函数,此时dom对应的相关 ...

  8. chrome中如何查看元素的hover事件

    chrome中如何查看元素的hover事件 一.总结 一句话总结: Elements->Styles里面可以看到":hov":点开选择":hover"就可 ...

  9. 移动端触摸、点击事件优化(fastclick源码学习)

    移动端触摸.点击事件优化(fastclick源码学习) 最近在做一些微信移动端的页面,在此记录关于移动端触摸和点击事件的学习优化过程,主要内容围绕fastclick展开.fastclick githu ...

随机推荐

  1. Chrome DevTools的15个使用技巧【转载】

    1.快速文件转换 2.在源代码中搜索 3.跳到特定行 4.在控制台中选择元素 5.使用多个光标和选择 6.保存日志 7.格式化打印{} 8.设备模式 9.设备仿真传感器 10.颜色选择器 11.强制元 ...

  2. 解决js小数求和出现多位小数问题

    在小数相加时,可能会产生多个小数位.如下所示: var x=1+1;   //2 var x=1.20+1.11;   //2.31 var x=1.56+1.76;   //3.3200000000 ...

  3. [转]HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  4. WordPress ”无法发送电子邮件,可能原因:您的主机禁用了mail()函数“的解决办法

    WordPress网站中出现 "无法发送电子邮件,可能原因:您的主机禁用了mail()函数"的情况一般都是因为所在主机环境不支持在线邮件收发功能导致,如果不支持的话,那么像类似 N ...

  5. CentOS6.4 增加一个SFTP上传的用户

    #创建sftp组 groupadd sftp #创建一个用户dsideal useradd -g sftp -s /bin/false dsideal #设置dsideal用户的密码 passwd d ...

  6. bug: 在使用HMSegmentedControl时,设置selectionIndicatorEdgeInsets对左右边界没有用

    若设置了    self.tabSegmented.selectionStyle = HMSegmentedControlSelectionStyleFullWidthStripe; 则必须使用sel ...

  7. [友盟微博分享]does not contain bitcode. You must rebuild it with

    1.我的 Xcode 明明打开了 bitcode 了,为什么还会报错呢?挺奇怪的. 2.上网一查,才知道,友盟需要 bitcode,Xcode 不支持,只要关闭bitcode就可以 了. 3.其实我也 ...

  8. hadoop CLASSNAME命令使用注意点

    Hadoop中可是使用hadoop CLASSNAME命令.这个CLASSNAME就是你写好的类名.hadoop CLASSNAME命令类似于java classname. 使用hadoop CLAS ...

  9. viso 由于形状保护和/或图层属性设置不能进行编辑

    viso 由于形状保护和/或图层属性设置不能进行编辑 2003: 若要变通解决此问题,删除 从删除 的保护属性,当您尝试删除一个受保护的组件.若要这样做,请按照下列步骤操作:在 Visio 2003或 ...

  10. python基础学习——第二天

    一.python种类 1.1 Cpython python官方版本,使用c语言实现,运行机制:先编译,py(源码文件)->pyc(字节码文件),最终执行时先将字节码转换成机器码,然后交给cpu执 ...