pageX,clientX,offsetX,layerX的那些事

PageX clientX区别：

PageX：IE(不支持)鼠标在页面上的位置,从页面左上角开始,即是以页面为参考点,不随滑动条移动而变化。

clientX：鼠标在页面上可视区域的位置,从浏览器可视区域左上角开始,即是以浏览器滑动条此刻的滑动到的位置为参考点,随滑动条移动而变化。

转化代码：
var doc = document.documentElement,body=document.body;
pageX = clientX + Math.max(doc.scrollLeft,body.scrollLeft);
pageY = clientY  + Math.max(doc.scrollTop,body.scrollTop);

offsetX  layerX 区别：

offsetX：IE特有,鼠标相比较于触发事件的元素的位置,以元素盒子模型的内容区域的左上角为参考点,如果有boder,可能出现负值。IE以内容区域开始,鼠标向上进入border将出现负值。

layerX：FF特有,鼠标相比较于当前坐标系的位置,即如果触发元素没有设置绝对定位或相对定位,以页面为参考点,如果有,将改变参考坐标系,从触发元素盒子模型的border区域的左上角为参考点。

offsetX以border为参考，layerX以内容为参考。