css属性pointer-events的运用和document.ElementFromPoint:根据坐标获得元素

元素中css样式：pointer-events的属性使用

pointer-events:none，设置成功的时候，意味着位于该元素下的元素可以被触发事件，而该元素不会被触发事件（事件可以穿透该元素，直接到达下面的元素上)

pointer-events:none的作用是让元素实体“虚化”。例如一个应用pointer-events:none的按钮元素，则我们在页面上看到的这个按钮，只是一个虚幻的影子而已，您可以理解为海市蜃楼，幽灵的躯体。当我们用手触碰它的时候可以轻易地没有任何感觉地从中穿过去。
一切都是幻影!

一般和渐变样式混合使用；

eg:

{

 

1. pointer-events: none;
2. line-height: 1;
3. background: -webkit-linear-gradient(left,rgba(255,255,255,.01)0,rgba(255,255,255,.9)30%,#fff 100%);
4.  
   background: -ms-linear-gradient(left,rgba(255,255,255,.01) 0,rgba(255,255,255,.9) 30%,#fff 100%);
5. background: -webkit-linear-gradient(left,rgba(255,255,255,.01)0,rgba(255,255,255,.9)30%,#fff 100%);
6. background: linear-gradient(to right,rgba(255,255,255,.01)0,rgba(255,255,255,.9)30%,#fff 100%);

}

 

 

document.ElementFromPoint:根据坐标获得元素，可用于触屏设备上获取当前点击元素的名称