1、客户区坐标位置  (相对于客户端视口,而无关浏览器缩放)

clientX与clientY:表示事件发生时鼠标在视口的坐标,不包括页面滚动距离,因此不代表鼠标在页面上的位置。

2、页面坐标位置

pageX与pageY:包括页面滚动距离,代表鼠标在页面上的位置。

无滚动时,clientX==pageX,clientY==pageY

3、屏幕坐标位置

screenX与screenY:鼠标指针相对于整个屏幕的坐标位置

var div=document.getElementById("div");
EventUtil.addHandler(div,"click",function(ev){
ev=EventUtil.getEvent(event);
//没有滚动时,页面坐标=客户区坐标
alert('客户区坐标'+event.clientX+','+event.clientY);
alert('页面坐标'+event.pageX+','+event.pageY);
alert('屏幕坐标'+event.screenX+','+event.screenY);
})

JS事件(四)坐标位置的更多相关文章

  1. js获取鼠标坐标位置兼容多个浏览器

    这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...

  2. JS事件调试 - 查找HTML元素绑定的事件以及绑定代码所在位置

    日常的网页开发调试工作中,经常需要知道指定的某个网页元素绑定了哪些事件以及绑定代码的位置,下面介绍三种用来跟踪页面中的事件的方法. 1.使用firefox调试 我们可以使用firefox的debug工 ...

  3. js获取div相对屏幕的坐标位置

    1:div相对屏幕的坐标位置 function getDivPosition(div){ var x = div.getBoundingClientRect().left; var y = div.g ...

  4. js点击获取—通过JS获取图片的绝对对坐标位置

    一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示:  <!DOCTYPE html> <html lang="en"> <head> ...

  5. js点击获取—通过JS获取图片的相对坐标位置

    一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...

  6. C#-WebForm-JS知识:基础部分、BOM部分、DOM部分、JS事件

    一.基础部分: 1.JavaScript 是什么? 是一门脚本语言,是属于弱类型(语言语法很随意),C#是强类型(语言语法非常严格)(李献策lxc) 优点:JS 执行速度快 2.JS 与java有什么 ...

  7. 2018-06-30 js事件

    一.js代码加载的时机 1.DOM加载完毕 -> 将js代码放到body体之下即可: 2.网页资源加载完毕-> $(window).onload(function(){  }); 3.jQ ...

  8. dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来

    dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...

  9. JS事件

    JS事件:  声明:为了事件对象event跨浏览器兼容: var oEvent==ev||event;      所以在下面用到 event 的地方都用 oEvent 代替  1)doucument的 ...

随机推荐

  1. python设计模式第五天【单例模式】

    1. 定义 一个类只有一个实例,提供访问该实例的全局方法 2.应用场景 (1)多线程之间共享对象资源 (2)整个程序空间中的全局变量,共享资源 (3)大规模程序的节省创建对象的时间 3.代码实现(使用 ...

  2. 三、安装MyCat-Web

    一.下载和解压MyCat-web http://dl.mycat.io/mycat-web-1.0/ wget http://dl.mycat.io/mycat-web-1.0/Mycat-web-1 ...

  3. 【python练习题】程序8

    #题目:输出 9*9 乘法口诀表. for i in range(1,10): k = '' for j in range(1,i+1): k += '%s * %s = %s '%(i,j,i*j) ...

  4. LVS (Linux Virtual Server) 负载均衡

    [大型网站技术实践]初级篇:借助LVS+Keepalived实现负载均衡   一.负载均衡:必不可少的基础手段 1.1 找更多的牛来拉车吧 当前大多数的互联网系统都使用了服务器集群技术,集群即将相同服 ...

  5. 搭建Hexo博客(三)—换电脑继续写Hexo博客

    Hexo和GitHub搭建博客的原理是:Hexo将source下的md文件生成静态的html页面,存放到public目录中,这一步是由命令:hexo -g完成.接下来执行hexo -d命令,就将pub ...

  6. Git简介及安装

    1 Git简介 Git是一个开源的分布式版本控制系统,可以有效.高速的处理从很小到非常大的项目版本管理. Git是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码 ...

  7. HDU3507-Print Article-斜率dp入门题

    为了学CDQ分治,从斜率dp和凸包开始做吧.. 代码就是维护一个凸包.利用递增的性质丢掉不合适的点. http://www.cnblogs.com/Rlemon/p/3184899.html 代码学的 ...

  8. 进程PID 与PPID

    # 同一个程序执行多次是多个进程 import time import os print('爹是:',os.getppid()) #查看父进程 print('me是: ',os.getpid()) # ...

  9. OpenCv的CV2一些函数总结

  10. new Date()导致日期增加了一天

    问题是:将字符串 "Sun Nov 12 14:00:00 CST 2017"  转成Date类型 有一个简单的方法是直接使用new Date(),但是这个方法对于某些日期的计算, ...