html元素重叠 下面的元素仍然响应事件的解决

其实就是pointer-events和elementFromPoint

对于两个div，div a覆盖了div b，但是要让div b能够接收到鼠标的事件，有两种方法：

1.在firefox chrome等支持CSS3浏览器中，有个css属性叫pointer-events，设置div a的 pointer-events: none，

于是a上经过的所有鼠标事件都会过滤掉而不触发，相当于事件从a上直接渗透到了b上，于是b能响应事件。这时给a绑定了事件，也不会触发。

2.在IE中没有css3的属性，但是要拿到这个事件，可以通过给body绑定鼠标事件，然后在事件响应里通过

document.elementFromPoint(e.clientX,e.clientY)来获取当前鼠标所在位置的元素，虽然事件不是由你想要的那个元素触发的，但是通过这种方式能把元素和事件联系起来，但是效率上没有直接获得那么高而已。

var obj = window;//var obj = document.body;var event = function(e){var targ = document.elementFromPoint(e.clientX,e.clientY);//targ 就是你需要响应事件的元素};var evt = "click";if(obj.addEventListener){obj.addEventListener(evt,event,false);}else if(obj.attachEvent){obj.attachEvent('on'+evt,event);}