鼠标Event位置 视窗位置

鼠标Event位置  鼠标事件event对象

clientX	以浏览器左上顶角为原点，定位 x 轴坐标
clientY	以浏览器左上顶角为原点，定位ｙ轴坐标
offsetX	以当前事件的目标对象content左上角为原点，定位x轴坐标
offsetY	以当前事件的目标对象content左上角为原点，定位y轴坐标
pageX	以Document 对象（即文本窗口）左上角为原点，定位x轴坐标
pageY	以Document 对象（即文本窗口）左上角为原点，定位ｙ轴坐标
screenX	计算机屏幕左上角为原点，定位x轴坐标
screenY	计算机屏幕左上角为原点，定位ｙ轴坐标
layerX	最近的绝对定位的父元素（如果没有，则为Document对象）左上角为原点，定位x轴坐标
layerY	最近的绝对定位的父元素（如果没有，则为Document对象）左上角为原点，定位ｙ轴坐标

视窗位置和尺寸

----获取视口宽高

window.innerWidth 视口宽度 包括滚动条  width+padding+border+滚动条 不支持IE8

window.innerHeight 视口高度 包括滚动条

----页面滚动位置

window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop

window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft

不支持IE8

----窗口在显示器的位置

window.screenLeft || window.screenX

window.screenTop || window.screenY

标准浏览器使用的是 screenX/screenY，IE 中使用的是 screenLeft/screenTop

元素占用的位置 空间尺寸

----元素不含滚动条的尺寸 不包括边框

document.documentElement.clientWidth || document.body.clientWidth

document.documentElement.clientHeight || document.body.clientHeight

----计算后的CSS样式的border-left-width/border-top-width 边框

document.documentElement.clientLeft

document.documentElement.clientTop

----元素包括滚动条和边框的尺寸

document.documentElement.offsetWidth

document.documentElement.offsetHeight

即 width+padding+border+滚动条

----元素相对于最近的祖先定位元素的左右偏移值

document.documentElement.offsetLeft

document.documentElement.offsetTop

----元素内容的宽高+滚动

document.documentElement.scrollWidth || document.body.scrollWidth
document.documentElement.scrollHeight || document.body.scrollHeight

----元素滚动条的位置

document.documentElement.scrollLeft

document.documentElement.scrollTop