理解 e.clientX,e.clientY e.pageX e.pageY e.offsetX e.offsetY
event.clientX、event.clientY
鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条。IE事件和标准事件都定义了这2个属性
event.pageX、event.pageY
类似于event.clientX、event.clientY,但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性,但得到了广泛支持。IE事件中没有这2个属性。
event.offsetX、event.offsetY
鼠标相对于事件源元素(srcElement)的X,Y坐标,只有IE事件有这2个属性,标准事件没有对应的属性。
event.screenX、event.screenY
鼠标相对于用户显示器屏幕左上角的X,Y坐标。标准事件和IE事件都定义了这2个属性

理解 e.clientX,e.clientY e.pageX e.pageY e.offsetX e.offsetY的更多相关文章
- 一文看懂js中的clientX,clientY,pageX,pageY,screenX,screenY
一. 客户区坐标位置(clientX,clientY) 鼠标事件都是在浏览器视口中的特定位置发生的.这个位置信息保存在事件对象的clientX和clientY属性中,所有浏览器都支持这两个属性. 我们 ...
- JavaScript 中一些概念理解 :clientX、clientY、offsetX、offsetY、screenX、screenY
clientX 设置或获取鼠标指针位置相对于窗口客户区域的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条. clientY 设置或获取鼠标指针位置相对于窗口客户区域的 y 坐标,其中客户区域不包 ...
- JavaScript 中事件对象参数:clientX、clientY、offsetX、offsetY、screenX、screenY
JavaScript 中一些概念理解 :clientX.clientY.offsetX.offsetY.screenX.screenY clientX 设置或获取鼠标指针位置相对于窗口客户区域的 x ...
- 如何更好的理解(pageX,pageY,clientX,clientY,eventX,eventY,scrollX,scrollY,screenX,screenY,event.offsetX,event.offsetY,offsetLeft,style.left)
1 pageX,pageY:鼠标指针相对于当前窗口的X,Y坐标,计算区域包括窗口自身的控件和滚动条.(火狐特有) 2 event.clientX,event.clientY:鼠标指针相对于当前窗口的X ...
- 理解clientX、clientY、offsetLeft、event.offsetTop、offsetWidth、offsetHeight、clientWidth、clientHeight、scrollTop、scrollHeight
一.clientX和clientY 事件发生时,鼠标距离浏览器的可视区域的X.Y轴的位置,不包含滚动条的区域的部分.就算是页面进行了滚动,鼠标的坐标值还是参考可视区域的. 二.offsetLeft和o ...
- JS——事件详情(鼠标事件:clientX、clientY的用法)
鼠标位置 >可视区位置:clientX.clientY 跟着鼠标移动的div案例 代码如下图: 这个案例,运用到前一篇文章中的event事件来处理.获取div的left和top值,当鼠标移动 ...
- clientX和clientY属性需要注意的地方
clientX和clientY为可视区鼠标的位置. 1. 随鼠标移动的div块[runjs] 当document有多个页面时,会出现问题.[runjs] 2. 解决方案:scrollTop, scro ...
- pageX、pageY全兼容
pageX.pageY全兼容 var pos=function(o,x,y,event){var posX=0,posY=0;var e=event||window.event;if(e.posX|| ...
- 理解screenX clientX pageX概念
先了解screenX,clientX,pageX概念 screenX: 鼠标位置相对于用户屏幕水平偏移量,而screenY就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX: 跟s ...
随机推荐
- MYSQL--表分区、查看分区
一. mysql分区简介 数据库分区 数据库分区是一种物理数据库设计技术.虽然分区技术可以实现很多效果,但其主要目的是为了在特定的SQL操作中减少数据读写的总量以缩减sql语句的响应时 ...
- python- 日志学习
# @File : learn_logging.py #-*- coding:utf-8 -*- """ 日志:log 记录代码执行的过程 一旦记录下来,就可以根据日志去 ...
- python 获取整点时间戳,半整点时间戳 ,同时将时间戳转换成 日期时间
import time, datetime def gettime(): for x in range(24): a = datetime.datetime.now().strftime(" ...
- python学习笔记_week9
一.paramiko模块 SSHClient,用于连接远程服务器并执行基本命令 基于用户名密码连接: ssh执行命令:stdin,stdout,sterr:标准输入.输出.错误 import para ...
- 监控hdfs 块迁移数量脚本及 metasave 日志内容详解
把以下脚本配置到 crontab 下 ,10分钟一次,进行打点,记录复制块的进度. 想让节点快速退役(下线)的方法可以参考我的 https://www.cnblogs.com/jiangxiaoxia ...
- C#并口热敏小票打印机打印位图包括芯片的写入
下面是打印所需要调用的代码: class LptControl { private string LptStr = "lpt1"; public LptControl(string ...
- 20165304实验一java开发环境熟悉
实验报告封面 一.实验报告封面 课程:Java程序设计 班级:1653班 姓名:李松杨 学号:20165304 指导教师:娄嘉鹏 实验日期:2018年4月2日 实验时间:13:45 - 15:25 实 ...
- [ilink32 Error] Fatal: Unable to open file 'SDDEBUG.OBJ'
[ilink32 Error] Fatal: Unable to open file 'SDDEBUG.OBJ' 这个路径NativeXml407\general\sdDebug.pas找不到了 修正 ...
- day19-高阶函数、匿名函数
map 函数 map 是一个在 Python 里非常有用的高阶函数.它接受一个函数和一个序列(迭代器)作为输入,然后对序列(迭代器)的每一个值应用这个函数,返回一个序列(迭代器),其包含应用函数后的结 ...
- tp5中ajax方式提交表单
用ajax提交表单,迅速,快捷,实现页面无刷新提交表单. <!DOCTYPE html> <html lang="en"> <head> < ...