编程 Javascript

jQuery获得页面元素的绝对/相对位置即绝对X,Y坐标

Posted in Javascript onMarch 06, 2014

获取页面某一元素的绝对X,Y坐标，可以用offset()方法：

<span style="color:#000066; font-weight:bold">var</span> X <span style="color:#339933">=</span> $<span style="color:#009900">(</span><span style="color:#3366CC">'#DivID'</span><span style="color:#009900">)</span>.<span style="color:#660066">offset</span><span style="color:#009900">(</span><span style="color:#009900">)</span>.<span style="color:#660066">top</span><span style="color:#339933">;</span> 
<span style="color:#000066; font-weight:bold">var</span> Y <span style="color:#339933">=</span> $<span style="color:#009900">(</span><span style="color:#3366CC">'#DivID'</span><span style="color:#009900">)</span>.<span style="color:#660066">offset</span><span style="color:#009900">(</span><span style="color:#009900">)</span>.<span style="color:#660066">left</span><span style="color:#339933">;</span>

获取相对(父元素)位置:

<span style="color:#000066; font-weight:bold">var</span> X <span style="color:#339933">=</span> $<span style="color:#009900">(</span><span style="color:#3366CC">'#DivID'</span><span style="color:#009900">)</span>.<span style="color:#660066">position</span><span style="color:#009900">(</span><span style="color:#009900">)</span>.<span style="color:#660066">top</span><span style="color:#339933">;</span> 
<span style="color:#000066; font-weight:bold">var</span> Y <span style="color:#339933">=</span> $<span style="color:#009900">(</span><span style="color:#3366CC">'#DivID'</span><span style="color:#009900">)</span>.<span style="color:#660066">position</span><span style="color:#009900">(</span><span style="color:#009900">)</span>.<span style="color:#660066">left</span><span style="color:#339933">;</span>

jQuery获得页面元素的绝对/相对位置即绝对X,Y坐标

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

图片自动缩小的js代码,用以防止图片撑破页面

Mar 12 Javascript

Js+Flash实现访问剪切板操作

Nov 20 Javascript

JQuery与Ajax调用新浪API获取短网址的代码

Feb 07 Javascript

ext中store.load跟store.reload的区别示例介绍

Jun 17 Javascript

js点击文本框后才加载验证码实例代码

Oct 20 Javascript

JavaScript使用DeviceOne开发实战（三）仿微信应用

Dec 02 Javascript

js判断文本框输入的内容是否为数字

Dec 23 Javascript

JavaScript中的高级函数

Jan 04 Javascript

微信小程序button组件使用详解

Jan 31 Javascript

babel的使用及安装配置教程

Feb 22 Javascript

Javascript中prototype与__proto__的关系详解

Mar 11 Javascript

微信小程序form表单组件示例代码

Jul 15 Javascript

Jquery easyUI 更新行示例

Mar 06 #Javascript

js toFixed()方法的重写实现精度的统一

Mar 06 #Javascript

button没写type=button会导致点击时提交

Mar 06 #Javascript

使用jQuery时Form表单元素ID和name命名大忌

Mar 06 #Javascript

js字符串日期yyyy-MM-dd转化为date示例代码

Mar 06 #Javascript

浅析JS中document对象的一些重要属性

Mar 06 #Javascript

浅析jquery的js图表组件highcharts

Mar 06 #Javascript

You might like

古巴咖啡 Cubita琥爵咖啡独特的加勒比海风味咖啡

2021/03/06 新手入门

PHP操作XML作为数据库的类

2010/12/19 PHP

php操作（删除,提取,增加）zip文件方法详解

2015/03/12 PHP

PHP设计模式（九）外观模式Facade实例详解【结构型】

2020/05/02 PHP

Prototype最新版(1.5 rc2)使用指南(1)

2007/01/10 Javascript

用JavaScript获取DOM元素位置和尺寸大小的方法

2013/04/12 Javascript

Jquery时间验证和转换工具小例子

2013/07/01 Javascript

JQuery中使用Ajax赋值给全局变量异常的解决方法

2014/01/10 Javascript

jquery实现叠层3D文字特效代码分享

2015/08/21 Javascript

Node.js Streams文件读写操作详解

2016/07/04 Javascript

简单谈谈JS数组中的indexOf方法

2016/10/13 Javascript

H5移动端图片压缩上传开发流程

2016/11/09 Javascript

bootstrap table实现单击单元格可编辑功能

2017/03/28 Javascript

angularjs实现天气预报功能

2020/06/16 Javascript

JavaScript基础心法数据类型

2018/03/05 Javascript

微信小程序倒计时功能实例代码

2018/07/17 Javascript

javascript跳转与返回和刷新页面的实例代码

2019/11/20 Javascript

[02:20]DOTA2英雄基础教程黑暗贤者

2013/12/19 DOTA

Python判断列表是否已排序的各种方法及其性能分析

2016/06/20 Python

Python之os操作方法(详解)

2017/06/15 Python

符合语言习惯的 Python 优雅编程技巧【推荐】

2018/09/25 Python

实例讲解Python中浮点型的基本内容

2019/02/11 Python

python+pygame实现坦克大战

2019/09/10 Python

Python如何创建装饰器时保留函数元信息

2020/08/07 Python

Python pip 常用命令汇总

2020/10/19 Python

巴西手表购物网站：eclock

2019/03/19 全球购物

小学数学教学反思

2014/02/02 职场文书

元旦促销方案

2014/03/15 职场文书

党员干部一句话承诺

2014/05/30 职场文书

街道社区活动报告

2015/02/05 职场文书

先进基层党组织主要事迹材料

2015/11/03 职场文书

用Python实现屏幕截图详解

2022/01/22 Python

JS实现数组去重的11种方法总结

2022/04/04 Javascript

Nginx禁止ip访问或非法域名访问

2022/04/07 Servers

SQL Server的存储过程与触发器以及系统函数和自定义函数

2022/04/10 SQL Server

mysql全面解析json/数组

2022/07/07 MySQL