screenX:鼠标位置相对于用户屏幕水平偏移量，而screenY也就是垂直方向的，此时的参照点也就是原点是屏幕的左上角。

clientX:跟screenX相比就是将参照点改成了浏览器内容区域的左上角，该参照点会随之滚动条的移动而移动。

pageX：参照点也是浏览器内容区域的左上角，但它不会随着滚动条而变动

screenX clientX pageX区别的更多相关文章

  1. 理解screenX clientX pageX概念

    先了解screenX,clientX,pageX概念 screenX: 鼠标位置相对于用户屏幕水平偏移量,而screenY就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX: 跟s ...

  2. screenX clientX pageX的区别

    screenX:鼠标位置相对于用户屏幕水平偏移量,而screenY也就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX:跟screenX相比就是将参照点改成了浏览器内容区域的左上角 ...

  3. screenX, clientX, pageX

    screenX:鼠标相对屏幕左上角的水平偏移量. clientX:鼠标相对于浏览器左上角的水平偏移量,会随着滚动条的移动而移动. pageX:鼠标相对浏览器左上角的水平偏移量.不会随着滚动条的移动而移 ...

  4. 图解Js event对象offsetX, clientX, pageX, screenX, layerX, x区别

    通过 3 张图和 1 张表格,轻松区别 JavaScript Event 对象中的offsetX, clientX, pageX, screenX, layerX, x等属性. 一.测试代码如下: & ...

  5. JS-特效 ～ 03. 楼层跳跃、事件对象event的获取与使用、event的主要内容、screenX、pageX、clientX的区别、放大镜、模拟滚动条

    楼层跳跃 100%子盒子会继承父盒子的宽高.父盒子继承body宽高.Body继承html的宽高. 盒子属性:auto:适应盒子自身的宽度或者高度.(对自己负责) 盒子属性:100%:适应盒子父盒子的宽 ...

  6. 一张图轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别

    总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕,于是决定做个图来区分一下(画得我手那个酸呀....) 先总结下区别: event.c ...

  7. clientX,offsetX,screenX,pageX 区别！

    先总结下区别: event.clientX.event.clientY 鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性 eve ...

  8. 鼠标事件以及clientX、offsetX、screenX、pageX、x的区别

    鼠标事件 鼠标事件有下面这几种: 1. onclick 鼠标点击事件 box.onclick = function(e){ console.log(e) } 2. onmousedown 鼠标按下事件 ...

  9. event对象中offsetX,clientX,pageX,screenX的区别

    1.offsetXoffset意为偏移量,是事件对象距左上角为参考原点的距离.以元素盒子模型的内容区域的左上角为参考点.不包括border.2.clientX事件对象相对于浏览器窗口可视区域的X,Y坐 ...

随机推荐

  1. NYOJ 78 圈水池 （入门级凸包）

    题目链接:nyoj 78  单调链凸包小结 题目讲解:本题考查的主要是凸包的用法,算是入门级的吧,当然前提是你接触过,平面几何: AC代码: #include<iostream> #inc ...

  2. Qt pro文件语法

    在Qt下做开发的时候.pro文件就是工程的配置文件,虽然很多时候里面的选项是工具自动生成的,但是难免会需要手动修改的时候,下面就记录一下它的基本语法 #:在.pro文件中表示注释,注释当前行 TEMP ...

  3. django中使用POST方法报错 URL via POST, but the URL doesn't end in a slash

    该方式是因为URL路径没有使用slash(斜线"/")结尾造成的. 因此在使用POST的JavaScript函数的路径参数中,路径URL必须使用/结尾.

  4. Jquery学习笔记（10）--ajax删除用户，使用了js原生ajax

    主要复习了php的pdo数据库操作,和js的ajax,真麻烦,希望jquery的ajax简单点. index.php: <!DOCTYPE html> <html lang=&quo ...

  5. XML序列化和反序列化（C#）

    主要参考资料: http://www.codeproject.com/Articles/483055/XML-Serialization-and-Deserialization-Part-1 http ...

  6. SQLite学习手册(转)

    原文网址:http://www.cnblogs.com/stephen-liu74/archive/2012/01/22/2328757.html 在实际的应用中,SQLite作为目前最为流行的开源嵌 ...

  7. flutter table 在showModalBottomSheet中

    问题是,不知道为什么又可以了.原来是显示黑屏,没有输出. showModalBottomSheet<void>( context: context, builder: (BuildCont ...

  8. 使用Navicat连接阿里云服务器上的MySQL数据库

    1.首先打开Navicat,文件>新建连接> 2,两张连接方法 1>常规中输入数据库的主机名,端口,用户名,密码 这种直接连就可以了 第2种方法: 常规中输入数据库的信息,主机名用l ...

  9. 【复习】密码算法——AES

    0 AES简介 1997年1月2号,美国国家标准技术研究所宣布希望征集一个安全性能更高的加密算法(AES)[3],用以取代DES.我们知道DES的密钥长度是64 bits,但实际加解密中使用的有效长度 ...

  10. SyncML 同步协议 感谢 周鹏（我只是做一个备份）

    SyncML 同步协议(SyncML Sync Protocol) 翻译周鹏 2006-1-24 摘要 本规范定义了SyncML客户和服务的同步协议. 它规范了怎样使用SynML表示层协议去完成Syn ...