android 浏览器 div穿透,解决IE 上重叠div 对 mouseover 事件的穿透方法之一

解决IE 下重叠div 对 mouseover 事件的穿透方法之一

? ? ? ? 历经一天半的时间，我这前端的白痴终于想到了一个解决IE 下重叠div ?对 mouseover 事件的穿透方法。

?

?

现象： 两个并列关系的Div(没有父子关系)，但是两个Div在位置上面有重叠，当鼠标在两个div重叠部分的时候，会触发下层div的mouseover事件(IE)，从而触发上层div 的mouseleave事件。

?

?

? ? ? ? 注意：两个div没有父子关系，所以我没有在事件冒泡上面进行探索，我对各种浏览器事件冒泡也不是很精通，想学习的童鞋可以上网查一下，这方面的资料相当的多。

?

? ? ? ? 探索的过程放到后面，先把最后的解决方便告诉大家，其实很简单，就是在上层div的mouseleave事件中进行判断，如果鼠标还在上层div中 就执行上层divmouseleave中的逻辑，不执行下层div的mouseenter逻辑(未实现)。

?

?

this._ul.mouseenter(function(e){

//JS里面访问 类成员方法必须 使用this

that._open(jq(this));

e.stopPropagation();

}).mouseleave(function(e){

//为了防止IE下 div重叠时候对鼠标事件的穿透(非冒泡)

//判断 鼠标不在ul中的时候才隐藏排序列表

var temp=jq(this);

var temp_left=temp.offset().left;

var temp_width =temp.width();

var temp_top=temp.offset().top;

var temp_height=temp.height();

var _dir_x = (e.clientX>temp_left)&&(e.clientX

var _dir_y = (e.clientY>temp_top)&&(e.clientY

if(!_dir_x || !_dir_y){

that._close(jq(this));

}

e.stopPropagation();

});

?

?

1.html 强制 ie8兼容性视图

?

2.mouseover ?mouseEnter 区别 是否冒泡

?

3.Z-index 仅能在定位元素上奏效(例如 position:absolute;)！ z-index=-1;

?

4.Bug ?本来是想选择排序的 ?结果 点到了 ? “全市分店”上面 ?IE6，IE8

?

? http://www.aibang.com/beijing/hunyanjiudian/

?

5.JQuery 屏蔽 div 鼠标事件

?

6.CSS 模板 或者 滤镜 还实现下层div不处理mouseover事件？

?