jQuery获取页面元素绝对与相对位置的方法


Posted in Javascript onJune 10, 2015

本文实例讲述了jQuery获取页面元素绝对与相对位置的方法。分享给大家供大家参考。具体如下:

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

var X = $('#DivID').offset().top;
var Y = $('#DivID').offset().left;

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

var X = $('#DivID').position().top; 
var Y = $('#DivID').position().left; 
var pleft = $("selector").scrollLeft();//元素相对于滚动条左边的偏移量
var pTop = $("selector").scrollTop();//元素相对于滚动条顶部的偏移量

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
基于JQuery的类似新浪微博展示信息效果的代码
Jul 23 Javascript
JS动态调用方法名示例介绍
Dec 18 Javascript
深入探讨javascript中的数据类型
Mar 04 Javascript
JavaScript的Date()方法使用详解
Jun 09 Javascript
javascript之Boolean类型对象
Jun 07 Javascript
AngularJS中directive指令使用之事件绑定与指令交互用法示例
Nov 22 Javascript
微信小程序开发之录音机 音频播放 动画实例 (真机可用)
Dec 08 Javascript
JS实现手写parseInt的方法示例
Sep 24 Javascript
如何安装控制器JavaScript生成插件详解
Oct 21 Javascript
swiper.js插件实现pc端文本上下滑动功能示例
Dec 03 Javascript
微信小程序实现判断是分享到群还是个人功能示例
May 03 Javascript
Vue实现微信支付功能遇到的坑
Jun 05 Javascript
Javascript中的getUTCHours()方法使用详解
Jun 10 #Javascript
jQuery实现首页图片淡入淡出效果的方法
Jun 10 #Javascript
简介JavaScript中的getUTCFullYear()方法的使用
Jun 10 #Javascript
javascript中一些util方法汇总
Jun 10 #Javascript
Javascript中的getUTCDay()方法使用详解
Jun 10 #Javascript
在JavaScript中操作时间之getUTCDate()方法的使用
Jun 10 #Javascript
JavaScript中的getTimezoneOffset()方法使用详解
Jun 10 #Javascript
You might like
收音机术语解释
2021/03/01 无线电
深入php多态的实现详解
2013/06/09 PHP
php事务处理实例详解
2014/07/11 PHP
php源码分析之DZX1.5字符串截断函数cutstr用法
2015/06/17 PHP
PHP的数组中提高元素查找与元素去重的效率的技巧解析
2016/03/03 PHP
laravel 输出最后执行sql 附:whereIn的使用方法
2019/10/10 PHP
非常好的js代码
2006/06/27 Javascript
JQuery 学习笔记 选择器之六
2009/07/23 Javascript
jquery 操作单选框,复选框,下拉列表实现代码
2009/10/27 Javascript
JS与框架页的操作代码
2010/01/17 Javascript
Js-$.extend扩展方法使方法参数更灵活
2013/01/15 Javascript
js单词形式的运算符
2014/05/06 Javascript
Javascript中的apply()方法浅析
2015/03/15 Javascript
javascript伸缩菜单栏实现代码分享
2015/11/12 Javascript
JS中常用的输出方式(五种)
2016/06/12 Javascript
Vuejs第八篇之Vuejs组件的定义实例解析
2016/09/05 Javascript
Javascript之面向对象--接口
2016/12/02 Javascript
详解Vue 开发模式下跨域问题
2017/06/06 Javascript
vue中的ref和$refs的使用
2018/11/22 Javascript
python实现bitmap数据结构详解
2014/02/17 Python
跟老齐学Python之用Python计算
2014/09/12 Python
python实现的文件同步服务器实例
2015/06/02 Python
用python处理图片之打开\显示\保存图像的方法
2018/05/04 Python
numpy给array增加维度np.newaxis的实例
2018/11/01 Python
Django框架会话技术实例分析【Cookie与Session】
2019/05/24 Python
Django之使用celery和NGINX生成静态页面实现性能优化
2019/10/08 Python
python文件操作的简单方法总结
2019/11/07 Python
python 元组的使用方法
2020/06/09 Python
python如何安装下载后的模块
2020/07/03 Python
python3让print输出不换行的方法
2020/08/24 Python
Happy Plugs官网:瑞典无线耳机品牌
2020/07/16 全球购物
大学生旅游业创业计划书
2014/01/29 职场文书
英语专业个人求职信范文
2014/02/01 职场文书
自动化毕业生专业自荐书范文
2014/02/04 职场文书
幼儿园家长寄语
2014/04/02 职场文书
市场总经理岗位职责
2014/04/11 职场文书