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. atitit.md5算法的原理 与 总结

    atitit.md5算法的原理 与 总结 1. MD5的位数 128位1 2. 字节数组转换为32位字符串 base161 2.1. 十六进制字符用4个二进制位来表示1 2.2. byte[]和十六进 ...

  2. [na]台式机装原版Win2008R2

    坑了老半天,总结出几点 1,系统os下载: http://msdn.itellyou.cn/ 注:其他地方下载的,装后发现不是起不来就是驱动装不了. 2,u盘里放个压缩软件: 好呀压缩   和  浏览 ...

  3. strtol / strtoll / strtoul / strtoull

    function long int strtol (const char* str, char** endptr, int base); —— Convert string to long integ ...

  4. windows下安装C语言环境

    安装 1.下载 min-gw 安装程序,链接为:http://sourceforge.net/projects/mingw/files/,下载 Download mingw-get-setup.exe ...

  5. docker jupyter

    151  curl -sSL https://get.docker.com/|sh 152  sudo usermode -aG docker ubuntu 153  sudo usermod -aG ...

  6. ArrayList 和 HashMap 的默认大小是多数？

    ArrayList 和 HashMap 的默认大小是多数? 在 Java 7 中,ArrayList 的默认大小是 10 个元素,HashMap 的默认大小是16个元素(必须是2的幂).这就是 Jav ...

  7. ITDB部署

    官方地址:http://www.sivann.gr/software/itdb/ 方法如下: 前提:首先需要三个东西:APACHE,PHP5,SQLITE3,php5-sqlite 环境:ubuntu ...

  8. Hadoop--mapreduce编程实例1

    前提准备: 1.hadoop安装运行正常.Hadoop安装配置请参考:Ubuntu下 Hadoop 1.2.1 配置安装 2.集成开发环境正常.集成开发环境配置请参考 :Ubuntu 搭建Hadoop ...

  9. springboot2.0 fastjson 日期格式化不生效解决

    网上有很多介绍,主要有两种. 1.在启动类中注入bean /** * 集成fastjson * * @return */ @Bean public HttpMessageConverters fast ...

  10. Effective C++：条款39：明智而审慎地使用private继承

    (一) (1)private继承意味着"依据某物实现出".仅仅有实现部分被继承.接口部分应略去: (2)它仅仅在软件"实现"层面上有意义,在软件"设计 ...