鼠标事件位置笔记

	*事件属性:
	*clientX、clientY(鼠标指针位置相对于当前窗口)
	*offsetX、offsetY(非IE下:相对触发事件的对象的border的顶点的位置)
	*layerX、layerY
	*pageX、pageY(相对于窗口并包含滚动条的位置)
	*screenX、screenY相对于屏幕的顶点,当然就包含工具条之类的东东占具的位置
	*
	*
	*在IE8中:
	*offsetX、offsetY表示相对于对应元素的顶点(border的右下角,不算border,点在border上是负数)的位置
	*clientX、clientY是相对于当前可视范围的距离,不会受到body滚动条的影响
	*x、y相当于chrome中的pageX,pageY受body滚动条影响
	*screenX、screenY是相对于浏览器窗口的距离
	*
	*chrome中:
	*offsetX、offsetY表示相对于对应元素的顶点(border的左上角,要计算border的宽高)的位置
	*
	*clientX、clientY是相对于当前可视范围的距离,不会受到body滚动条的影响
	*
	*x、y与clientX、clientY效果是相同的
	*
	*pageX、pageY是相对于body的距离,受滚动条影响
	*ev.clientY + document.body.scrollTop - document.documentElement.scrollLeft与pageY是相等的,在chrome中,在IE中就不要想了
	*layerX、layerY相对于第一个relative或absolute元素(包括它自己)的位置,设置了overflow也是相对于自己,
	*否则就跟pageX、pageY一个样了,在chrome中不受元素本身滚动条景响
	*
	*screenX、screenY是相对于浏览器窗口的距离
	*
	*firefox中:
	*pageX、pageY同chrome
	*clienX、clientY同chrome
	*layerX、layerY与chrome的区别是会家到本身滚动条的影响
	*screenX、screenY是相对于浏览器窗口的距离
	*不支持x、y与offsetX、offsetY
	*
	*/

 

你可能感兴趣的:(鼠标事件)