每每看到event.client、event.screen与event.offset这几个,头都大了,今天又碰到了,特来总结下。

  1、event.screenX与event.screenY。

  首先,event.screenX是鼠标相对于用户显示器屏幕左上角的X坐标。

  而event.screenY则是鼠标相对于用户显示器屏幕左上角的Y坐标。

  在标准事件和IE事件中都定义了这2个属性

  

  2、event.clientX与event.clientY。

  event.clientX是鼠标相对于浏览器窗口可视区域的X坐标(窗口坐标),可视区域不包括工具栏和滚动条。

  event.clientY是鼠标相对于浏览器窗口可视区域的Y坐标(窗口坐标),可视区域不包括工具栏和滚动条。

  3、event.offsetX与event.offsetY

  offsetX 设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标。

  offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 y 坐标。

  

  这样说,感觉还是有点难以理解,因此这里用图片来说明:

        

  总结:screen是相对于屏幕而言的,而client则是相对于文档而言的,而offset则是相对于父容器而言的。

浅谈event.client、event.screen与event.offset的更多相关文章

  1. 浅谈c#中的delegate和event了

    一.开篇忏悔 对自己最拿手的编程语言C#,我想对你说声对不起,因为我到现在为止才明白c#中的delegate和event是怎么用的,惭愧那.好了,那就趁着阳光明媚的早晨简单来谈谈delegate和ev ...

  2. salesforce lightning零基础学习(九) Aura Js 浅谈二: Event篇

    上一篇介绍了Aura Framework中 Component类的部分方法,本篇将要介绍Event常用的方法. 1. setParam (String key , Object value):设置事件 ...

  3. [DOM Event Learning] Section 1 DOM Event 处理器绑定的几种方法

    [DOM Event Learning] Section 1 DOM Event处理器绑定的几种方法   网页中经常需要处理各种事件,通常的做法是绑定listener对事件进行监听,当事件发生后进行一 ...

  4. 浅谈Android系统进程间通信(IPC)机制Binder中的Server和Client获得Service Manager接口之路

    文章转载至CSDN社区罗升阳的安卓之旅,原文地址:http://blog.csdn.net/luoshengyang/article/details/6627260 在前面一篇文章浅谈Service ...

  5. 浅谈IM软件client的断线重连、心跳和长在线

    版权声明:原创文章,未经博主同意禁止转载.欢迎点击头像上方"郭晓东的专栏"查看专栏 https://blog.csdn.net/hherima/article/details/27 ...

  6. FAQ:Domain Event 和 C# 中的 Event 有啥区别?

    问: Domain Event 和 C# 中的 Event 有啥区别? 答: C# 中的 Event,事件.监听者列表和事件发布器是由一个类型承担,事件源和监听者之间的生命周期耦合在一起,C# 帮你提 ...

  7. Event Handling Guide for iOS--(三)---Event Delivery: The Responder Chain

    Event Delivery: The Responder Chain 事件传递:响应链 When you design your app, it’s likely that you want to ...

  8. 浅谈ASP.NET的Postback

    说道ASP.NET的Postback,就得说Web Page的生命周期,但是Web Page的生命周期却不是三言两语就能够说得清楚的,所以在这里单纯站的编程的角度,撇开Web Page 的生命周期浅谈 ...

  9. Spring5.0源码学习系列之浅谈BeanFactory创建

    Spring5.0源码学习系列之浅谈BeanFactory创建过程 系列文章目录 提示:Spring源码学习专栏链接 @ 目录 系列文章目录 博客前言介绍 一.获取BeanFactory主流程 二.r ...

随机推荐

  1. HTML5 给图形绘制阴影(绘制五角星示例)

    几个属性 shadowOffsetX:阴影的横向位移量. shadowOffsetY:阴影的纵向位移量. shadowColor:阴影的颜色. shadowBlur:阴影的模糊范围. 属性说明 sha ...

  2. flask 动手写的接口平台

    笔者做的是测试,在群里经常有人讨论,怎么和开发对接怎么难,怎么测接口比较难,开发不愿因写文档等等,是啊,我感觉也是这样,沟通,还有我们应该怎样去学习,去扩充自己,让自己不再受开发所左右, 笔者就像试图 ...

  3. angularjs 字段排序 多字段排序

    我们用angularjs {{}},ng-model循环绑定数组或对象的内容的时候,有时候会用到排序,有时候可能会有多个字段排序 具体要用到过滤 数据的展现,可以通过ng-repeat实现.当网页解析 ...

  4. 字符串匹配KMP算法的C语言实现

    字符串匹配是计算机的基本任务之一. 举例来说,有一个字符串"BBC ABCDAB ABCDABCDABDE",我想知道,里面是否包含另一个字符串"ABCDABD" ...

  5. 树链剖分( 洛谷P3384 )

    我们有时候遇到这样一类题目,让我们维护树上路径的某些信息,这个时候发现我们无法用线段树或者树状数组来维护这些信息,那么我们就有着一种新的数据结构,树剖:将一棵树划分成若干条链,用数据结构去维护每条链, ...

  6. XML的解析(DOM以及SAX方式)

    感谢http://blog.csdn.net/redarmy_chen/article/details/12951649(关于SAX解析)以及http://blog.csdn.net/zhangerq ...

  7. TCP网络编程-----客户端请求连接服务器、向服务器发数据、从服务器接收数据、关闭连接

    SOCKET m_sockClient; unsigned short portNum; ------------------------------------------------------- ...

  8. iOS 动画篇 (二) CAShapeLayer与CoreAnimation结合使用

    接上一篇博客 iOS 动画篇(一) Core Animation CAShapeLayer是CALayer的一个子类,使用这个类能够很轻易实现曲线的动画. 先来一个折线动画效果: 示例代码: //1. ...

  9. Java学习笔记12(面向对象五:构造方法、this再探)

    在开发中,经常需要在创建对象的同时明确对象对的属性值, 比如一个Person对象创建时候就应该有age和name等属性 那么如何做到在创建对象的同时给对象的属性初始化值呢? 这里介绍构造方法: 1.构 ...

  10. socket之粘包发生问题

    粘包 注意注意注意: res=subprocess.Popen(cmd.decode('utf-8'),shell=True,stderr=subprocess.PIPE,stdout=subproc ...