JS事件(四)坐标位置
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事件(四)坐标位置的更多相关文章
- js获取鼠标坐标位置兼容多个浏览器
这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...
- JS事件调试 - 查找HTML元素绑定的事件以及绑定代码所在位置
日常的网页开发调试工作中,经常需要知道指定的某个网页元素绑定了哪些事件以及绑定代码的位置,下面介绍三种用来跟踪页面中的事件的方法. 1.使用firefox调试 我们可以使用firefox的debug工 ...
- js获取div相对屏幕的坐标位置
1:div相对屏幕的坐标位置 function getDivPosition(div){ var x = div.getBoundingClientRect().left; var y = div.g ...
- js点击获取—通过JS获取图片的绝对对坐标位置
一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...
- js点击获取—通过JS获取图片的相对坐标位置
一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...
- C#-WebForm-JS知识:基础部分、BOM部分、DOM部分、JS事件
一.基础部分: 1.JavaScript 是什么? 是一门脚本语言,是属于弱类型(语言语法很随意),C#是强类型(语言语法非常严格)(李献策lxc) 优点:JS 执行速度快 2.JS 与java有什么 ...
- 2018-06-30 js事件
一.js代码加载的时机 1.DOM加载完毕 -> 将js代码放到body体之下即可: 2.网页资源加载完毕-> $(window).onload(function(){ }); 3.jQ ...
- dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
- JS事件
JS事件: 声明:为了事件对象event跨浏览器兼容: var oEvent==ev||event; 所以在下面用到 event 的地方都用 oEvent 代替 1)doucument的 ...
随机推荐
- 创建简单的表单Demo
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- atlassian、jira账户无法注册来这里
进入https://www.atlassian.com/try 注册成功 登陆 再次到邮箱点击链接 登陆成功(已经处于登陆状态:此时你已经拥有一个atlassian账户了)
- solr部署tomcat 访问HTTP Status 403 – Access to the requested resource has been denied
-----------解决403错误看这里!!-----------打开****\Tomcat 8.5\webapps\solr\WEB-INF里面的web.xml,把下面这段配置注释掉!!!如下所示 ...
- SVG路径
前面的话 本文将详细介绍SVG路径 path字符串 路径(path)是一个非常强大的绘图工具,可以用path元素绘制矩形(直角矩形或者圆角矩形).圆形.椭圆.折线形.多边形,以及一些其他的形状,例如贝 ...
- hdu-5536(字典树)
题意:给你n个数,让你在n个数中选三个,使得(a1+a2)^a3的值最大,a1!=a2!=a3(下标不等于): 解题思路:01字典树可以写,因为数据小,我们可以先把n个数建一颗字典树,然后两边for找 ...
- luogu3702-[SDOI2017]序列计数
Description Alice想要得到一个长度为nn的序列,序列中的数都是不超过mm的正整数,而且这nn个数的和是pp的倍数. Alice还希望,这nn个数中,至少有一个数是质数. Alice想知 ...
- Nginx 慢启动与拥塞窗口
L:127
- Mysql(Mariadb)数据库主从复制
Mysql主从复制的实现原理图大致如下: MySQL之间数据复制的基础是以二进制日志文件(binary log file)来实现的,一台MySQL数据库一旦启用二进制日志后,其作为master,它数据 ...
- Keepalived+Haproxy高可用负载均衡群集
介绍 HAProxy提供高可用性.负载均衡以及基于TCP和HTTP应用的代理,支持虚拟主机,它是免费.快速并且可靠的一种解决方案.HAProxy特别适用于那些负载特大的web站点,这些站点通常又需要会 ...
- [NOIp2009] $Hankson$ 的趣味题
类型:数论 传送门:>Here< 题意:给出四个数$a_0,a_1,b_0,b_1$,求满足$gcd(x,a_0)=a_1,lcm(x,b_0)=b_1$的$x$的个数 解题思路 显然$a ...