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. mysql之mysqldump、mysqlimport

    一.引言 前一段在做一个csv的导入工具,最麻烦的部分就是对csv文件的解析,最后,老大提醒说是不是考虑的过于麻烦了,由于当时考虑到mysql是允许指定导出的csv文件的格式的,所以考虑到想要兼容这种 ...

  2. C# tif文件转jpg

    需要添加WindowBase,PresentationCore的引用. 代码如下: private Stream GetImageStream() { //可以通过网络或本地文件的形式,返回Tif文件 ...

  3. 如何在Openwrt上，针对内核创建自定义Patch?

    参考资料: 1.http://wiki.openwrt.org/doc/devel/patches?s[]=quilt   --- 官方对于如何打Patch的说明 2.http://blog.csdn ...

  4. 如何在openWRT系统上实现双版本

    最近由于项目需要,需要在AR9331芯片单板(原来是4MBFlash,后来扩充到16MB Flash)上,实现openwrt双版本机制. 双版本的好处,主要是:在升级版本过程中,如果遇到断电等情况,不 ...

  5. hihoCoder #1291 : Building in Sandbox 逆向处理+并查集维护

    /** 题目:#1291 : Building in Sandbox 链接:https://hihocoder.com/problemset/problem/1291 题意:就是一个三维的空间里,按照 ...

  6. Linux下vi命令小结

     进入vi的命令         vi filename :打开或新建文件,并将光标置于第一行首    vi n filename :打开文件,并将光标置于第n行首    vi filename :打 ...

  7. css3学习笔记（一）

    1. IE下的渐变:  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='# ...

  8. thinkphp 从服务器拉取下来 验证码失效

    public function verify(){ ob_end_clean();//加入 $verify = new \Think\Verify(); $verify->entry(1); }

  9. 第一百四十四节，JavaScript，列队动画

    JavaScript,列队动画 将上一节的,移动透明动画,修改成可以支持列队,也就是可以给这个动画方法多个动画任务,让它完成一个动画任务后,在执行第二个动画任务 原理: 就是在原有的动画方法里加一个回 ...

  10. （转）java中Executor、ExecutorService、ThreadPoolExecutor介绍

    转自: http://blog.csdn.net/linghu_java/article/details/17123057 ScheduledThreadPoolExecutor介绍: http:// ...