一图胜千言。

做了一个图：

【前端】screenX/Y, clientX/Y, pageX/Y 的区别的更多相关文章

  1. screenX、clientX、pageX的区别

    screenX:鼠标位置相对于用户屏幕水平偏移量,而screenY也就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX:跟screenX相比就是将参照点改成了浏览器内容区域的左上角 ...

  2. pageX/Y, offset(), position(), scrollTop(), screenX/Y, clientX/Y, pageX/Y

    event.pageX get mouse position Description: The mouse position relative to the left edge of the docu ...

  3. 原生js获取鼠标坐标方法全面讲解：clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y【转】

    关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...

  4. clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y ,offsetTop,offsetLeft 详解

    clientX/Y: clientX/Y获取到的是触发点相对浏览器可视区域左上角距离,不随页面滚动而改变 兼容性:所有浏览器均支持 pageX/Y: pageX/Y获取到的是触发点相对文档区域左上角距 ...

  5. 原生js获取鼠标坐标方法全面讲解：clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y

    关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...

  6. pagex/y offsetx/y screenx/y clientx/y 用法及区别

    1  pagex/pagey:鼠标相对于整个页面的x/y坐标 注:整个页面的意思就是你整个页面的全部 例如:宽200px 高400px 那么pagex/y他们最大值就是它 2,offsetX/y与pa ...

  7. clientX/Y pageX/Y offsetX/Y layerX/Y screenX/Y clientHeight innerWidth...

    关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...

  8. 通过了解JS的clientX、pageX、screenX等方法来获取鼠标位置相对屏幕，相对浏览器窗口，相对文档的坐标详解

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  9. pageX/pageY,screenX/screenY,clientX/clientY的差别

    pageX/pageY,screenX/screenY,clientX/clientY的差别 $(document).click(function(e){ //x方向无差别 //alert(e.pag ...

  10. yum -y upgrade 和 yum -y update 区别

    分别测试yum -y upgrade和yum -y update 升级前 系统版本: CentOS5.5 内核版本: 2.6.18-194.el5 升级前做过简单配置文件修改 yum -y upgra ...

随机推荐

  1. 快速原型设计工具-Axure RP的介绍及简单使用（生产初期向客户展示设计产品的原型-也就是展示产品）

    啧啧~~ 给大家介绍一款超棒的原型设计工具--美国Axure Software Solution公司旗舰产品Axure RP 这款工具通俗的说呢,就是在项目整体需求考察后对整体设计一个简要性概括!设计 ...

  2. 【OpenWRT】【RT5350】【三】MakeFile文件编写规则和OpenWRT驱动开发步骤

    一.Makefile文件编写 http://www.cnblogs.com/majiangjiang/articles/3218002.html 可以看下上面的博客,总结的比较全了,在此不再复述 二. ...

  3. Linq语言性能比较

    我不只一次听到不少做技术的朋友随口一句,“linq性能是最差的”,由于缺少具体的数字比照也就没在意,但心里隐隐觉得事实应该不是这样的,我记得我第一次听到有人贬低C# 3.0是在我工作后不久的一个夏季, ...

  4. cmd导入导出

    2:用cmd进入命令行输入:tnsping cmstar就是测试172.18.13.200是否连接成功3:导入与导出,如下: 数据导出: 1 将数据库TEST完全导出,用户名system 密码mana ...

  5. 一、oracle数据库成功安装步骤 （11gR2）

    下载安装包 从Oracle官方网站下载数据库软件安装包:http://www.oracle.com/technetwork/cn/database/enterprise-edition/downloa ...

  6. 基于Java Mina 通信框架的JT/T809转发服务器设计

    Apache MINA 是 Apache 组织的一个开源项目,为开发高性能和高可用性的网络应用程序提供了非常便利的框架. 也是Java开发者的一个福利(.NET目前还没有类似封装的这么好的基础sock ...

  7. sql server 数据库 日期格式转换

    日期时间转字符串:Select CONVERT(varchar(100), GETDATE(), 0): 05 16 2006 10:57AM Select CONVERT(varchar(100), ...

  8. 利用Python实现从百度下载图片到本地磁盘

    import urllib.request import os import re url=r'http://image.baidu.com/search/index?tn=baiduimage&am ...

  9. java选择排序

    /** * 选择排序 * @param a * @date 2016-10-8 * @author shaobn */ public static void selectSort(int[] a){ ...

  10. Java多线程开发系列之三：线程这一辈子（线程的生命周期）

    前文中已经提到了,关于多线程的基础知识和多线程的创建.但是如果想要很好的管理多线程,一定要对线程的生命周期有一个整体概念.本节即对线程的一生进行介绍,让大家对线程的各个时段的状态有一定了解. 线程的一 ...