screenX / Y,clientX / Y和pageX / Y之间有什么区别?
什么 区别 之间
2023-09-27 14:28:58 时间
offsetX,offsetY
IE浏览器
特有的事件属性
鼠标点击的位置相当于事件源元素
的位置坐标,以元素盒子模型的内容区域的左上角为参考点
clientX,clientY
设置或获取鼠标指针位置相对于
浏览器视口(内容区域的左上角)
的坐标,与浏览器是否有滚动条无关
相对于页面的可见部分的左上角,通过浏览器窗口“看到”。
相对于viewport
CSS像素的坐标。
screenX,screenY
设置或获取获取鼠标指针位置相对于
物理屏幕的左上角
的坐标,当改变屏幕的分辨率
的时候,坐标会随之改变
相对于screen
设备像素的坐标。
- 对于这个属性
probably never need
pageX,pageY
相对于浏览器中完
全呈现的内容区域
的左上角,此参考点位于左上方的网址栏和后退按钮下方。如果在页面中嵌入可嵌入的可滚动页面,并且用户移动滚动条,则可以实际改变位置。
坐标相对于整个渲染页面的左上角(包括滚动隐藏的部分)
相对于<html>
CSS像素中元素的坐标。
- pageX与clientX的区别
也就是说,当浏览器没有滚动条的时候,pageX和clientX是一样的
document.addEventListener('click', function(e) {
console.log(
'page: ' + e.pageX + ',' + e.pageY,
'client: ' + e.clientX + ',' + e.clientY,
'screen: ' + e.screenX + ',' + e.screenY)
}, false);
相关文章
- 哪种食用油最好?各种食用油的功效有什么不同?
- 巨兽频频出没,OpenStack初创企业凭什么成功?
- 投资极路由,我们在投什么?
- htm与html的区别是什么
- LF和CRLF是什么及区别
- 面试官:谈谈 Spring Cloud 与 Dubbo 有什么区别?
- 「经典题」JS中map()和forEach()有什么区别?
- 快速上手!java中栈是什么意思
- 软件测试中的测试计划和测试用例起到什么作用?
- java中error 和 exception 有什么区别?
- RDD、DataFrame和DataSet的区别是什么
- 是什么卡住了大数据的应用?
- 用最简单的语言给你解释“什么是股权稀释”
- 共享云到底是一朵什么云?
- GET和POST本质上有什么区别,这才是标准答案
- 【Java集合】JDK1.7和1.8 HashMap有什么区别
- oracle中to_timestamp和to_date什么区别
- BI是报表?BI是可视化?BI到底是什么?
- 人工智能可以用来做什么?
- 什么是Tendermint?(2)
- 想转行软件测试,首先要了解软件测试是什么,在团队担任的什么责任,前景是怎么样的?
- Python中repr(变量)和str(变量)的返回值有什么区别和联系
- Kubernetes 控制平面故障期间会发生什么?
- 什么时候具体用到'单例模式'.
- "想要"还是“喜欢”:什么是上瘾
- CSS中一个冒号和两个冒号有什么区别
- 用户鉴权、JWT(JSON Web Token)是什么?
- dotnet 数组自动转基类数组提示 Co-variant array conversion 是什么问题
- 什么是Http无状态?Session、Cookie、Token三者之间的区别
- Cache 和 Buffer 都是缓存,主要区别是什么?【转】
- 【埋点】什么是埋点?埋点的实现方式?
- 【并发编程038】什么是适应性自旋?和普通自旋的区别?