pageX,clientX,screenX,offsetX区别
pageX/pageY:
鼠标相对于整个页面的X/Y坐标。
注意，整个页面的意思就是你整个网页的全部，比如说网页很宽很长，宽2000px，高3000px，那pageX,pageY的最大值就是它们了。
特别说明：IE不支持！
clientX/clientY：
事件发生时鼠标在浏览器内容区域的X/Y坐标（不包含滚动条）。
浏览器内容区域即浏览器窗口中用来显示网页的可视区域，注意这个可视，也就是说需要拖动滚动条才能看到的区域不算。
当你将浏览器窗口缩小时，clientX/clientY的最大值也会缩小，但始终，它们的最大值不会超过你浏览器可视区域。
特别说明：IE下此属性不规范，它们的最小值不是0而是2，也就是说IE下的clientX/clientY比火狐下始终大2px。
screenX/screenY
鼠标在屏幕上的坐标。screenX,screenY的最大值不会超过屏幕分辨率。
offsetX/offsetY:
得出的结果跟pageX/pageY一样，既然如此，它有什么存在价值？因为：
特别说明：只有IE支持！相当于IE下的pageX,pageY。
e.clientX + document.documentElement.scrollLeft - document.documentElement.clientLeft = e.pageX
e.clientY + document.documentElement.scrollTop - document.documentElement.clientTop = e.pageY
pageX,clientX,screenX,offsetX区别相关推荐
- event.x,event.clientX,event.offsetX区别
x:设置或者是得到鼠标相对于目标事件的父元素的外边界在x坐标上的位置. clientX:相对于客户区域的x坐标位置,不包括滚动条,就是正文区域. offsetx:设置或者是得到鼠标相对于目标事件的 ...
- clientX、pageX、screenX以及offsetX区别
clientX.pageX.clientX以及offsetX区别 client系列(不包含滚动条) clientX:鼠标相对于浏览器窗口可视区域x方向坐标 clientY:鼠标相对于浏览器窗口可视区域 ...
- 详细区分offsetX，clientX，pageX，screenX，layerX和X的区别
详细区分DOM事件中鼠标指针的坐标问题 前面博客中我们讲解到了DOM事件的event对象,里边包含了鼠标事件的指针坐标属性.比如event.offsetX,event.clientX,event.pa ...
- clientX、offsetX、screenX、pageX的区别
一.概念总结 1.event.clientX.event.clientY 鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性.cl ...
- offsetLeft理解以及MouseEvent接口中的screenX,clientX,pageX,offsetX区别.
背景 最近在做一款基于canvas的画板插件,开发过程中的画笔功能就会使用很多关于鼠标位置的属性:screenX/Y,clientX/Y,pageX/Y,offsetX/Y,以及节点offsetLef ...
- clientX,screenX,pageX,offsetX的区别
前言 关于clientX,screenX,pageX,offsetX的区别之前也比较迷糊,然后自己写了几个demo算是弄明白了,在这记录一下. 定义 一.clientX.clientY 点击位置距离当 ...
- html5 offsetx,event对象中offsetX,clientX,pageX,screenX的区别
1.offsetX offset意为偏移量,是事件对象距左上角为参考原点的距离.以元素盒子模型的内容区域的左上角为参考点.不包括border. 2.clientX 事件对象相对于浏览器窗口可视区域的X ...
- javascript 中 x offsetX clientX screenX pageX的区别
在javascript的事件对象中的关于事件鼠标位置的几个属性(x, pageX, offsetX, scrrenX clientX)及(y, pageY, offsetY, screenY, cli ...
- event对象的offsetX、clientX、pageX、screenX及 window.innerWidth、outerWidth使用详解
目录 offset client screen page window.innerWidht offset offsetX.offsetY为当前鼠标点击位置距离当前元素参考原点(左上角)的距离,而不同 ...
最新文章
- Hash函数的安全性
- php连接kafka集群,Kafka集群环境配置
- [BZOJ 2555] SubString
- Springboot整合redis（lettuce）
- mysql密码过期问题
- Java-JUC（六）：创建线程的4种方式
- 修改CDH的HostName和IP
- springboot项目自定义注解实现的多数据源切换--亲测有效
- 软件开发过程中的Visio使用
- 弯管机程序使用三菱FX系列 PLC和昆仑通态触摸屏，也可以用三菱F940系列触摸屏
- ArcGIS 正高转换成椭球体高度
- EasyPlayer-Android互联网直播视频播放器是如何实现播放器退到后台后再回到前台时，播放画面无缝衔接？
- 虚幻引擎4控制台变量和命令
- java代码比较数据_比对两个数据库的差异:Java篇
- android 自定义 对号,【Android】自定义progressBar和动画显示对号
- 为什么NR PDCP SDU最大为9000？
- 什么软件测试iphone性能,5款iPhone性能测试比拼：A9虽然垫底，与A13的差距并不大...
- 本地机连接不上虚拟机？
- 07 图形学——曲线曲面
- Codeforces Round #764 (Div. 3)（A~G）