从百度上搞下来的一段示例代码:
function isMouseLeave(evt, element) {
if (evt.type != 'mouseout' && evt.type != 'mouseover') return false;
var target = evt.relatedTarget ? evt.relatedTarget : evt.toElement;
while (target && target != element) {
target = target.parentNode;
}
return (target != element);
}
当一个标签包含子标签时,鼠标从父标签移动到子标签会连续触发父标签及子标签的onmouseover和onmouseout事件。
加入移出移入的代码:
li.onmouseover = function(e) {
// XXXX 移入实现
};
li.onmouseout = function(e) {
e = arguments[0] || window.event;
if (isMouseLeave(e, li_e)) {
// XXXX移出实现
}
};
看上去比较完美的实现,不过在实现中还是出了点差错,在万恶的IE6下,如果代码是这样的结构,并且下拉的菜单的下方有其他元素,问题就来了
<ul>
<li><a></a></li>
<li><a></a></li>
</ul>
原先的预期是鼠标移到ul上时li里的子菜单内容出现
虽然使用了以上方法,但当鼠标移到第二个li时,菜单又消失了。
搞了一个晚上,最后才发现了css设置的问题,需要将a的width设置到100%,让它充满整个li才不会突然跳出。
分享到:
相关推荐
兼容ie和firefox的鼠标经过(onmouseover和onmouseout)实现--简短版
最近两天在温习onmouseover事件和onmouseout事件,其实里面有很多深奥的知识,接下来小编给大家带来了onmouseover事件和onmouseout事件全面了解,感兴趣的朋友一起看下
图片模糊化,支持FF/IE6以上,onMouseOver事件可以使图片模糊,onMouseout变清晰。
一个DIV层,当鼠标移进的时候会触发onmouseover,移出的时候会触发onmouseout。 很简单的逻辑,这也是我们想要的!但随之烦恼也就来了:onmouseover并不会只在移进时才触发,onmouseout也不会只在移出时才触发!鼠标...
鼠标移上去显示别的东西,离开恢复原样;通过传递参数实现此功能
前段时间一直找这个的简短实现 网上也有很多方法 昨天发现了这种方法 感觉是用代码最少的 呵呵 ie下支持css的js ff等支持:hover 就这样了 觉得好的就顶起来 无标题文档 #b_g_date tr{ event:[removed]...
在ie6 下只有a 才支持:hover 伪类,其它标签都不支持,现在可以通过 csshover.htc 可以解决 ie6 的 hover 兼容问题。 它利用 javascript 脚本来给元素的的样式定义,如果检测到 hover 定义,就给元素设置 ...
3、css里面*各种操作卡死IE6的情况。如:<style>*{position:relative}</style> 4、js里面无限for循环卡死IE6。 5、jquery引起。如:一直等待下载某些并不存在的东西(比如外站的资源),严重时也会卡死...
页面显示所有图片,当鼠标移到图片上显示该图片详细信息并且加样式
一直想实现onmouseover和onmouseout应用于RadioButtonList或CheckBoxList控件上。此功能就是当鼠标经过时RadioButtonList或CheckBoxList每一个Item时,让Item有特效显示,离开时,恢复原样有演示动画,感兴趣的朋友...
c# 在webFrom上实现tabcontrol功能,可以实现tabcontrol中的所有功能,包括onmouseover事件和onclick事件,程序附有注释容易理解。
代码如下:”ondocumentready” xss=removed> ”onmouseover” xss=removed> ”onclick” xss=removed> ”onmouseout” xss=removed> ”test”> <SCRIPT LANGUAGE=”JavaScri
最近在做一个简单的鼠标onmouseover时显示层(层里面有多个链接文字),onmouseout 时隐藏层的功能时,发现有诸多问题.
onmouseover IE3、N2 当鼠标移动到某对象范围的上方时触发此事件 onmousemove IE4、N4 鼠标移动时触发此事件 onmouseout IE4、N3 当鼠标离开某对象范围时触发此事件 onkeypress IE4、N4 当键盘上的某个键被按下...
onMouseOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove IE4|N4|O 鼠标移动时触发的事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件 onKeyPress IE4|N4|O 当键盘上的某个键被按...
onMouseOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove IE4|N4|O 鼠标移动时触发的事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件 onKeyPress IE4|N4|O 当键盘上的某个键被按...