screenX：參照物为电脑的屏幕左上角，距离电脑屏幕的水平距离

clientX：參照物是内容区域左上角，距离内容区域左上角的水平距离，会随着滚动栏的移动而移动

pageX：參照物也是内容区域的左上角。距离内容区域左上角的水平距离，可是不会随着滚动栏的移动而移动

pagex，screenx，clientx的差别的更多相关文章

  1. pageX、clientX、screenX、offsetX、layerX、x

    参考:http://www.cnblogs.com/xesam/archive/2011/12/08/2280509.html chrome: e.pageX--相对整个页面的坐标e.layerX-- ...

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

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

  3. 【转】pageX、clientX、screenX、offsetX、layerX、x

    参考:http://www.cnblogs.com/xesam/archive/2011/12/08/2280509.html chrome: e.pageX——相对整个页面的坐标e.layerX—— ...

  4. 理解screenX clientX pageX概念

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

  5. offsetWidth, offsetHeight, offsetLeft, offsetTop,clientWidth, clientHeight,clientX,pageX,screenX

    offsetWidth: 元素在水平方向上占用的空间大小.包括元素的宽度,内边距,(可见的)垂直滚动条的宽度,左右边框的宽度. offsetHeight:元素在垂直方向上占用的空间大小,包括元素的高度 ...

  6. 元素位置pageX,pageY,clientX,clientY,scrollX,scrollY,screenX,screenY,offsetX,offsetY

    总结: event.clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条. (可见区域)event.clientY 设置或获取鼠标指针位置相对于当 ...

  7. [转]pageX、clientX、screenX、offsetX、layerX、x

    参考:http://www.cnblogs.com/xesam/archive/2011/12/08/2280509.html chrome: e.pageX——相对整个页面的坐标e.layerX—— ...

  8. clientX,offsetX,layerX,pageX,screenX,X鼠标位置全解

    clientX,offsetX,layerX,pageX,screenX,X有时容易记混,通过测试当前的主流浏览器疏理了自己的一些看法以供参考. Chrome下(测试版本为51.0.2704.106  ...

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

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

随机推荐

  1. Truck History(prim)

    http://poj.org/problem?id=1789 读不懂题再简单也不会做,英语是硬伤到哪都是真理,sad++. 此题就是一个最小生成树,两点之间的权值是毎两串之间的不同字母数. #incl ...

  2. mysql如何查询最新插入的数据

    在MySQL中,使用auto_increment类型的id字段作为表的主键,并用它作为其他表的外键,形成“主从表结构”,这是数据库设计中常见的用法.但是在具体生成id的时候,我们的操作顺序一般是:先在 ...

  3. bzoj1231[Usaco2008 Nov]mixup2 混乱的奶牛(状压dp)

    1231: [Usaco2008 Nov]mixup2 混乱的奶牛 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 1032  Solved: 588[ ...

  4. MySQL学习笔记之内连接

    不多说,直接上干货!  MySQL的内连接 #内连接,两个表按照条件匹配 select class1.stuid,class1.stuname,class1.sex,course from class ...

  5. 使用IDEA 搭建一个SpringBoot + Hibernate + Gradle

    ---恢复内容开始--- 打开IDEA创建一个新项目: 第一步: 第二步: 第三步: 最后一步: 如果下载的时候时间太久.可以找到build.gradle文件,添加以下代码.如下图 maven{ ur ...

  6. Flutter GitLab 客户端

    F4Lab Flutter for GitLab. 欢迎参加一起完成

  7. js 全选选框与取消全选代码

    设置一个全选选框和四个子选框,要实现点击全选后四个子选框选中,取消全选后四个子选框也取消.全选后点击某个子选框,全选也能取消.当四个子选框都选中时,全选框也被选择. 实现代码: <script& ...

  8. CryptoJS简单使用（request.js) 拦截器的使用

    首先准备一份明文和秘钥: var plaintText = 'aaaaaaaaaaaaaaaa'; // 明文var keyStr = 'bbbbbbbbbbbbbbbb'; // 一般key为一个字 ...

  9. kmp板子

    kmp 容易理解板子 详情见知乎 算法思想 对模式串求PMT,但实际上nxt数组是PMT向前移动一位 nxt数组含义:记母串为m[],模式串为p[]; m[i]与p[j]比较失配,需要比较m[i]与p ...

  10. 算法87-----DAG有向无环图的拓扑排序

    一.题目:课程排表---210 课程表上有一些课,是必须有修学分的先后顺序的,必须要求在上完某些课的情况下才能上下一门.问是否有方案修完所有的课程?如果有的话请返回其中一个符合要求的路径,否则返回[] ...