pageX/pageY,screenX/screenY,clientX/clientY的差别
$(document).click(function(e){
//x方向无差别
//alert(e.pageX+','+e.screenX+','+e.clientX);
//y方向有差别,无滚动条时pageY和clientY一样，有的话三者有差别
alert(e.pageY+','+e.screenY+','+e.clientY);
});
pageX/pageY,screenX/screenY,clientX/clientY的差别
2016-09-26
1214
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
pageX/pageY,screenX/screenY,clientX/clientY的差别
$(document).click(function(e){ //x方向无差别 //alert(e.
目录
相关文章
|
6月前
|
JavaScript
算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查，通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查，通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
83
1
1
|
6月前
|
JavaScript
|
3月前
|
前端开发
JavaScript
UED
如何巧妙实现element-plus中el-tree-v2的自适应横向滚动？
以上方法描述了如何使用简单的CSS和合适的HTML结构来巧妙实现在Element Plus库中 `el-tree-v2` 组件的自适应横向滚动功能。这种方法易于理解和实现，无需复杂的脚本或框架修改，只需利用CSS的强大功能即可完成。这有助于节省开发时间，同时能够提供良好的用户体验。
154
0
0
|
JavaScript
mouseover、mouseout和mouseenter、mouseleave之间的区别(配对使用)
mouseover、mouseout和mouseenter、mouseleave之间的区别(配对使用)
72
0
0
|
JavaScript
前端开发
详细区分offsetX，clientX，pageX，screenX，layerX和X的区别
详细区分DOM事件中鼠标指针的坐标问题
前面博客中我们讲解到了DOM事件的event对象，里边包含了鼠标事件的指针坐标属性。比如event.offsetX,event.clientX,event.pageX,event.screenX等等。现在我们来解析一下这些坐标属性的区别。
HTML代码：
<div class="box"></div>
<div class="box2"></div>
1
2
CSS代码：
.box{
width: 200px;
height: 200px;
backgro
98
0
0
|
SQL
Shell
数据库
|
前端开发
索引
|
Web App开发
前端开发
热门文章
最新文章
1
小技巧 - 怎样屏蔽群消息（包括 @全体成员）？
2
MAVEN简介之——settings.xml
3
RDS for SQL server 空间问题排查汇总
4
深度 ｜ 大数据算法应用的测试发展之路
5
JavaScript基本数据类型分析
6
【Linux】使用数字表示法和文件表示法修改文件权限（超详细）
7
艾伟：一个简单的关键字过滤算法
8
上海保交所发布区块链底层技术平台，为保险交易高效安全保驾护航
9
《程序员的修炼-培养思维潜能的9个习惯》 读书笔记
10
Swift析构器
1
`Object.create()` 方法的参数
28
2
js中new和object.creat区别
27
3
Kotlin - 运算符与中缀表达式
30
4
除了 `addEventListener` 方法，还有哪些方式可以为元素添加事件监听器？
26
5
如何同时在捕获阶段和冒泡阶段添加事件监听器？
29
6
`addEventListener` 方法的第三个参数有什么作用？
12
7
Kotlin - 运算符与中缀表达式
12
8
除了点击事件，`addEventListener` 还能用于处理哪些事件类型？
18
9
addEventlistener和正常的onclick=()=> 的区别
13
10
除了性能，块级作用域和函数作用域对代码的可读性和可维护性有何影响？
11