| 标题 | javascript实现鼠标移出事件onmouseout |
| 内容 | 最近在做一个简单的鼠标onmouseover时显示层（层里面有多个链接文字），onmouseout 时隐藏层的功能时，发现有诸多问题，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)"><span>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 onmouseout="this.style.display='none'" onmouseover="this.style.display='block'" > <b>更多此人的...</b> <a >留言板</a> <a >好友</a> <a></a> </div> |
| 随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。