当前位置: 代码迷 >> Web前端 >> onMouseOver 跟 onMouseOut事件冒泡
  详细解决方案

onMouseOver 跟 onMouseOut事件冒泡

热度:601   发布时间:2013-01-27 13:56:17.0
onMouseOver 和 onMouseOut事件冒泡

onMouseOver 和 onMouseOut事件是移入移出事件,当鼠标移入或者移出某元素时希望能有不同的显示效果或者执行一段js函数, 比如鼠标移入一个div框中希望这个框背景色会改变,移出时又恢复原样,这是网页设计常用的效果,但当div框有子元素时,背景色会闪动,因为发生了冒泡事件。


IE下有 onmouseenter和onmouseleave来解决。 


兼容方式:

function toolClose(dl,e){
		var relatedTarget = e.toElement || e.relatedTarget;
		while(relatedTarget && relatedTarget != dl)
			relatedTarget = relatedTarget.parentNode;
		if(!relatedTarget){
			dl.parentNode.className='fore3 menu';
	    }
	}

<dl onmouseover="toolOpen(this)" onmouseout="toolClose(this,event)" >