理解 e.clientX,e.clientY e.pageX e.pageY e.offsetX e.offsetY
event.clientX、event.clientY
鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条。IE事件和标准事件都定义了这2个属性
event.pageX、event.pageY
类似于event.clientX、event.clientY,但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性,但得到了广泛支持。IE事件中没有这2个属性。
event.offsetX、event.offsetY
鼠标相对于事件源元素(srcElement)的X,Y坐标,只有IE事件有这2个属性,标准事件没有对应的属性。
event.screenX、event.screenY
鼠标相对于用户显示器屏幕左上角的X,Y坐标。标准事件和IE事件都定义了这2个属性

理解 e.clientX,e.clientY e.pageX e.pageY e.offsetX e.offsetY的更多相关文章
- 一文看懂js中的clientX,clientY,pageX,pageY,screenX,screenY
一. 客户区坐标位置(clientX,clientY) 鼠标事件都是在浏览器视口中的特定位置发生的.这个位置信息保存在事件对象的clientX和clientY属性中,所有浏览器都支持这两个属性. 我们 ...
- JavaScript 中一些概念理解 :clientX、clientY、offsetX、offsetY、screenX、screenY
clientX 设置或获取鼠标指针位置相对于窗口客户区域的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条. clientY 设置或获取鼠标指针位置相对于窗口客户区域的 y 坐标,其中客户区域不包 ...
- JavaScript 中事件对象参数:clientX、clientY、offsetX、offsetY、screenX、screenY
JavaScript 中一些概念理解 :clientX.clientY.offsetX.offsetY.screenX.screenY clientX 设置或获取鼠标指针位置相对于窗口客户区域的 x ...
- 如何更好的理解(pageX,pageY,clientX,clientY,eventX,eventY,scrollX,scrollY,screenX,screenY,event.offsetX,event.offsetY,offsetLeft,style.left)
1 pageX,pageY:鼠标指针相对于当前窗口的X,Y坐标,计算区域包括窗口自身的控件和滚动条.(火狐特有) 2 event.clientX,event.clientY:鼠标指针相对于当前窗口的X ...
- 理解clientX、clientY、offsetLeft、event.offsetTop、offsetWidth、offsetHeight、clientWidth、clientHeight、scrollTop、scrollHeight
一.clientX和clientY 事件发生时,鼠标距离浏览器的可视区域的X.Y轴的位置,不包含滚动条的区域的部分.就算是页面进行了滚动,鼠标的坐标值还是参考可视区域的. 二.offsetLeft和o ...
- JS——事件详情(鼠标事件:clientX、clientY的用法)
鼠标位置 >可视区位置:clientX.clientY 跟着鼠标移动的div案例 代码如下图: 这个案例,运用到前一篇文章中的event事件来处理.获取div的left和top值,当鼠标移动 ...
- clientX和clientY属性需要注意的地方
clientX和clientY为可视区鼠标的位置. 1. 随鼠标移动的div块[runjs] 当document有多个页面时,会出现问题.[runjs] 2. 解决方案:scrollTop, scro ...
- pageX、pageY全兼容
pageX.pageY全兼容 var pos=function(o,x,y,event){var posX=0,posY=0;var e=event||window.event;if(e.posX|| ...
- 理解screenX clientX pageX概念
先了解screenX,clientX,pageX概念 screenX: 鼠标位置相对于用户屏幕水平偏移量,而screenY就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX: 跟s ...
随机推荐
- this绑定丢失的问题
在之前的一篇文章<this绑定>中已经说过this绑定的四种情况,也谈到了this绑定丢失的问题,但是没有解释为什么会出现this绑定的丢失,最近在多次阅读关于this绑定方面的文章之后, ...
- android 开发 实现一个ListView套嵌GirdView的滚动布局
效果图 实现思维: 首先要处理管理好需要导入的数据,我们这里创建class来处理这些数据并且便于管理它们. 创建一个主activity的布局,里面需要一个ListView控件. 创建一个class继承 ...
- nginx, supervisor, celery
资料: supervisor和nginx使用 1 .supervisor 管理进程工具 2 .nginx 反向代理, 负载均衡 安装nginx $ sudo apt-get update $ su ...
- sql server转oracle需要注意的几点
1. 字符型的字段相加需要用“||”,如果用“+”的话,会报“无效的数字”的错误. 2. Top 1 类似的脚本需要通过where rownum<=1来实现. 3. ISNULL函 ...
- J2SE 5.0-memory management whitepaper--delete
1.垃圾回收器期职责 开辟空间 任何引用可达的对象都在内存内 回收不再使用的内存 3.垃圾回收器概念 3.1.垃圾回收器期望的性能 垃圾回收器必须安全,存活的对象不应该被释放,应该释放的对象存活的时间 ...
- 纯CSS3实现垂直居中的九种方法
浏览时看到的资料,每个都做了测试,很好,就先收了~ 测试的是谷歌浏览器,没有任何问题,用360,IE11,火狐,搜狗浏览器做测试时,第五个方法在360,搜狗,和IE11有点问题,第七个在IE11有问题 ...
- scrapy之downloader执行流程
Agent = client.Agent class ScrapyAgent(object): _Agent = Agent#为twisted的client.Agent类 _ProxyAgent = ...
- java 构造json对象数组
利用for构造 import com.google.gson.JsonArray; import com.google.gson.JsonObject; public class Test { pub ...
- tensorflow实战系列(二)TFRecordReader
前面写了TFRecordWriter的生成.这次写TFRecordReader. 代码附上: def read_and_decode(filename): #根据文件名生成一个队列 fil ...
- js对象引用和赋值
体验更优排版请移步原文:http://blog.kwin.wang/programming/js-object-reference-assign.html 先看一个简单例子, var obj = { ...