layerX/layerY与offsetX/offsetY区别
时间:2022-06-08
本文章向大家介绍layerX/layerY与offsetX/offsetY区别,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
之前说过两种获取事件对象的方法
下面说一下,事件对象(事件源)获取位置的方法:
layerX/layerY与offsetX/offsetY获取事件源于鼠标作用的位置信息
IE: offsetX 当鼠标事件发生的时候,鼠标相对于事件源X轴的位置 offsetY
FF: layerX 当鼠标事件发生的时候,鼠标相对于事件源X轴的位置 layerY
下面简单代码实现事件源位置内容的获取:
鼠标.事件=function(e){
ev=window.event||e;//为了兼容低版本ie和流行版本的符合w3c规则的浏览器前者是低版本ie,后者是w3c的大众浏览器
var left=ev.layerX||ev.offsetX;
var top=ev.layerY||ev.offsetY;//兼容两种方式,前者w3c的合法化,后者是低版本ie获取距离事件对象(作用在事件源)顶部的距离(x是左端距离)
}
注意:上述的是事件对象的位置获取,下面介绍相当于浏览器的位置获取
clientX 当鼠标事件发生的时候,鼠标相对于浏览器左侧的距离
clientY 当鼠标事件发生的时候,鼠标相对于浏览器Y轴的位置
- Golang 语言--linux 下 go语言 vim设置
- 南阳OJ----Binary String Matching
- Golang RSA加密解密程序
- HDUOJ--汉诺塔II
- Golang语言-操作json,注意json的嵌套、数组
- Java随机数算法(一)(r11笔记第14天)
- 【翻译】Golang语言-是面向对象语言吗?
- 一些Golang小技巧
- 数据载入过慢?这里有一份TensorFlow加速指南
- 转--如何压缩Golang 编译出的可执行文件大小
- 转-Golang语言-- Test Case
- 最小公倍数
- 十条有用的 Golang语言 技术
- 闪回区报警引发的性能问题分析(r11笔记第11天)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- React 学习笔记(基础篇)
- 前端性能优化《一》——Chrome Performance 页面性能调试
- 【Vue 进阶】从 slot 到无渲染组件
- 一个合格的中级前端工程师应该掌握的 20 个 Vue 技巧
- Vue 3 任意传送门——Teleport
- @JsonCreator自定义反序列化函数-JSON框架Jackson精解第5篇
- 不靠谱的 console
- 使用ThreadLocal和ArgumentResolver方便开发
- 【Java8新特性】05 使用Optional取代null
- 在不被spring容器管理的类中使用ApplicationContext应用上下文bean
- Spring boot 在静态类中注入spring组件
- Spring boot 自定义配置文件
- 数据分析 常见技巧和经验总结
- Go by Example 中文版: Base64 编码
- Django3.0+supervisor+uvicorn+nginx进行线上部署