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. (Go)04.go工作区目录规范及简单例子

    一.规范目录结构 D:\project\src\go_dev\day1\example1 二.设置GOPAH环境变量 三.hello world 1.hello world package main ...

  2. mybatis中if标签判断字符串相等问题

    mybatis 映射文件中,if标签判断字符串sfyx变量是否是字符串Y的时候,发现并不管用: <if test="sfyx=='Y' "> and 1=1 </ ...

  3. CALayer帧动画

    CALayer帧动画 _sunLayer = [[CALayer alloc]init]; _sunLayer.contents = (id)[UIImage imageNamed:@"su ...

  4. jdbc 接口学习笔记

    一.JDBC概念 JDBC(Java Data Base Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,可以为多种关系型数据库提供统一访问,它由一组用Jav ...

  5. 证明,为什么HBase在创建表时,列簇是必须要,列可不要?

    若是删除不存在的列修饰符,看下会是什么情况 package zhouls.bigdata.HbaseProject.Test1; import javax.xml.transform.Result; ...

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

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

  7. jquery学习之$(document).ready()

    参考资料: 1.W3School在线教程:http://www.w3school.com.cn/jquery/event_ready.asp 2.某人博客园:http://www.cnblogs.co ...

  8. (转)Vue 爬坑之路(二)—— 组件之间的数据传递

    Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...

  9. 使用 gradle 在编译时动态设置 Android resValue / BuildConfig / Manifes中<meta-data>变量的值

    转载请说明来源: http://www.cnblogs.com/lizhilin2016/p/7390079.html 最近lz 在开始做一个新的Demo, 在项目中集成了bugly用于收集项目中的崩 ...

  10. Windows下错误码全解析

    windows系统下,调用函数出错时.可以调用GetLastError函数返回错误码.但是GetLastError函数返回值是DWORD类型,是一个整数.如果想要知道函数调用的真正错误原因,就需要对这 ...