javascript onmouseout 解决办法


Posted in Javascript onJuly 17, 2010

onmouseout 发现它的触发太敏感,当经过层内文字链时,即触发onmousetout事件,功能不能正常显示,经过一番搜索,整理出来,供大家参考。

1、

<script type="text/javascript"> 
function test(obj, e) { 


if (e.currentTarget) { 

if (e.relatedTarget != obj) { 

 if (obj != e.relatedTarget.parentNode) { 

alert(1); 

} 

} 

} else { 

if (e.toElement != obj) { 

if (obj != e.toElement.parentNode) { 

alert(1); 

} 

} 

} 

} 
</script> 

<div onmouseout="test(this, event)" style="width:100px;height:100px;border:1px #666 solid"> 


<span style="margin:5px;width:100%;height:100%;border:1px #ff0000 solid">faddsf</span>
</div>

2、
var LeaveFunext = function(t,f){for(var p in f){t[p]=f[p]} return t}; 

var IE = '\v' == 'v'; 

var contains = function(wrap,child){ 

if(IE) return wrap.contains(child); 

while(child && typeof(child.parentNode) != "undefind"){ 

if(wrap == child) return true; 

child = child.parentNode; 
} 
return false; 

}; 

var LeaveFun = function(o){ 

var _o = typeof o =="string" ? document.getElementById(o) : o; 

return this == window ? new LeaveFun(_o):LeaveFunext(_o, LeaveFun.prototype); 

}; 

LeaveFun.prototype = { 

mouseleave : function(fn){ 

if(IE){ 

this.attachEvent('onmouseleave',fn); 

}else{ 
this.addEventListener('mouseout',function(e){ 
tar = e.relatedTarget; 
if(!contains(this, tar)){ 
fn.call(this); 
} 

}, false); 

} 

return this; 

} 

}; 

//调用 

LeaveFun('share_customerdiv').mouseleave(function(){document.getElementById('share_customerdiv').style.display ='none';})

3、最简单,但在部分系统上会有轻微闪烁。
<div style="z-index: 11; " onmouseout="this.style.display='none'" onmouseover="this.style.display='block'" > 
<b class="STYLE19">更多此人的...</b> 
<a class="STYLE8" >留言板</a> 
<a class="STYLE8" >好友</a> 
<a class="STYLE8"></a> 
</div>
Javascript 相关文章推荐
javascript 精粹笔记
May 09 Javascript
js实现文章文字大小字号功能完整实例
Nov 01 Javascript
javascript数组输出的两种方式
Jan 13 Javascript
js获取内联样式的方法
Jan 27 Javascript
JQuery中$.each 和$(selector).each()的区别详解
Mar 13 Javascript
JS控制FileUpload的上传文件类型实例代码
Oct 07 Javascript
Vue.js实现简单动态数据处理
Feb 13 Javascript
vue中Element-ui 输入银行账号每四位加一个空格的实现代码
Sep 14 Javascript
ES6 Promise对象的应用实例分析
Jun 27 Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
Sep 11 Javascript
layui加载数据显示loading加载完成loading消失的实例代码
Sep 23 Javascript
javascript自定义加载loading效果
Sep 15 Javascript
javascript 从if else 到 switch case 再到抽象
Jul 17 #Javascript
用JavaScript对JSON进行模式匹配 (Part 2 - 实现)
Jul 17 #Javascript
用JavaScript对JSON进行模式匹配(Part 1-设计)
Jul 17 #Javascript
关于flash遮盖div浮动层的解决方法
Jul 17 #Javascript
JQUERY获取form表单值的代码
Jul 17 #Javascript
jQuery+ajax实现顶一下,踩一下效果
Jul 17 #Javascript
flexigrid 类似ext grid的JS表格代码
Jul 17 #Javascript
You might like
php中的一些数组排序方法分享
2012/07/20 PHP
php中require和require_once的区别说明
2014/02/27 PHP
php动态函数调用方法
2015/05/21 PHP
PHP简单判断iPhone、iPad、Android及PC设备的方法
2016/10/11 PHP
Javascript实现单张图片浏览
2014/12/18 Javascript
JavaScript生成的动态下雨背景效果实现方法
2015/02/25 Javascript
jquery+easeing实现仿flash的载入动画
2015/03/10 Javascript
js变形金刚文字特效代码分享
2015/08/20 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
2016/05/31 Javascript
JS构造函数与原型prototype的区别介绍
2016/07/04 Javascript
基于Three.js插件制作360度全景图
2016/11/29 Javascript
BootStrap实现带关闭按钮功能
2017/02/15 Javascript
jQuery树控件zTree使用方法详解(一)
2017/02/28 Javascript
令按钮悬浮在(手机)页面底部的实现方法
2017/05/02 Javascript
ES6扩展运算符用法实例分析
2017/10/31 Javascript
[11:27]《一刀刀一天》之DOTA全时刻20:TI4总奖金突破920W TS赛事分析
2014/06/18 DOTA
Python 字典(Dictionary)操作详解
2014/03/11 Python
python之wxPython菜单使用详解
2014/09/28 Python
用Python从零实现贝叶斯分类器的机器学习的教程
2015/03/31 Python
在python的类中动态添加属性与生成对象
2016/09/17 Python
Python实现的单向循环链表功能示例
2017/11/10 Python
解决Django中修改js css文件但浏览器无法及时与之改变的问题
2019/08/31 Python
HTML5中新标签和常用标签详解
2014/03/07 HTML / CSS
html5实现完美兼容各大浏览器的播放器
2014/12/26 HTML / CSS
架构师岗位职责
2013/11/18 职场文书
博士研究生自我鉴定范文
2013/12/04 职场文书
党课学习思想汇报
2014/01/02 职场文书
军训教官感言
2014/03/02 职场文书
教师师德师风个人整改方案
2014/09/18 职场文书
工作失职检讨书(精华篇)
2014/10/15 职场文书
银行客户经理岗位职责
2015/04/09 职场文书
主持人大赛开场白
2015/05/29 职场文书
2019暑假阅读倡议书
2019/06/24 职场文书
Python下opencv使用hough变换检测直线与圆
2021/06/18 Python
Python万能模板案例之matplotlib绘制直方图的基本配置
2022/04/13 Python
Spring Cloud OAuth2实现自定义token返回格式
2022/06/25 Java/Android