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. python学习之getdefaultlocale()函数

    def getdefaultlocale(envvars=('LC_ALL', 'LC_CTYPE', 'LANG', 'LANGUAGE')) 返回一个二元组. >>> local ...

  2. CSRF学习笔记之CSRF的攻击与防御以及审计【00x2 】

    Medium完整代码: <?php if (isset($_GET['Change'])) { // Checks the http referer header if ( eregi ( &q ...

  3. 新版期货数据交换（FTD）协议报文分析

    因为需要开发模拟CTP后台服务,实现一键切换CTP,所以我们需要分析CTP报文.(基于FTD协议2004版改进)   网上公开的只能找到04年老版本,和现前报文格式出入较大.参考:http://www ...

  4. 清空oracle数据库

    在开发过程中,可能经常需要重新初始化数据库,在初始化之前,我们肯定希望不再有以前的老表.存储过程等用户对象,用下面的教本就可以做到这一点: BEGIN FOR rec IN (SELECT objec ...

  5. 内部系统间调用client包的封装方法

    1.何为client 公司内部的系统调用,如果采用http直接调用,会非常不方便,而且不规范,接口升级或者变动,系统间的改动也是相当麻烦.所以在系统间采用client的互相调用,调用简单,如下: 获取 ...

  6. 配置Docker中国区官方镜像http://get.daocloud.io/ 很好的一个源http://get.daocloud.io/#install-docker

    https://www.daocloud.io/mirror#accelerator-doc 配置Docker中国区官方镜像http://get.daocloud.io/ 很好的一个源http://g ...

  7. 【Mac + Appium + Python3.6学习(四)】之常用的IOS自动化测试API总结

    环境: Appium:1.9.1 Appium-desktop:1.7.1 Xcode:10.0 IOS:iPhone5S(10.3.3) Mac:10.13.6 ①获取手机屏幕size:长.宽 &l ...

  8. tomcat 内存溢出原因分析及解决

    一.错误提示:java.lang.OutOfMemoryError: Java heap space [原因分析] tomcat默认可以使用内存为128MB,在较大型的应用项目中不足以满足运行要求,在 ...

  9. The.first.glance.at.linux.commands

    ## Get Ubuntu Version Info lsb_release -a ## Get Linux kernal info uname -a ## Get Computer name ech ...

  10. webapck卸载以及更换版本

    有时候我们需要安装webpack的指定版本,但是又安装了webpack的其他版本,就需要先卸载webpack 1.先执行 npm uninstall webpack -g 2.找到webpack的文件 ...