jQuery方法区别(二)position()与offset()区别
来源:互联网 发布:淘宝怎么设置自动上架 编辑:程序博客网 时间:2024/05/30 04:11
使用jQuery获取元素位置时,我们会使用position()或offset()方法,两个方法都返回一个包含两个属性的对象-左边距和上边距,它们两个的不同点在于位置的相对点不同。
可以看看下边的图:
从图中我们可以大体看出两者的区别。position()获取相对于它最近的具有相对位置(position:relative)的父级元素的距离,如果找不到这样的元素,则返回相对于浏览器的距离。
offset()始终返回相对于浏览器文档的距离,它会忽略外层元素。
下边看个简单的例子,这里外层的div元素(position:relative)仅一个:
<div id="outer" style="width:200px;position:relative;left:100px;"> <div id="inner" style="position:absolute;left:50px;top:60px;"> </div></div>
//获取相对于最近的父级(position:relative)的位置var vposition = $("#inner").position();alert(vposition.left); //输出:50alert(vposition.top); //输出:60var voffset = $("#inner").offset();alert(voffset.left); //输出:$("#outer").offset().left+50alert(voffset.top); //输出:$("#outer").offset().top+60
在不同浏览器中,offset()得到的相对于浏览器的位置不同,相信你看了上边相应的注释,已经掌握了position()同offset()方法的区别。
0 0
- jQuery方法区别(二)position()与offset()区别
- jQuery方法区别(二)position()与offset()区别
- jQuery方法position()与offset()区别
- jQuery操作css-position()与offset()方法的区别
- jQuery中position()与offset()区别
- position()与offset()区别
- position()与offset()区别
- jQuery中position()方法和offset()方法的区别
- Jquery中的offset()和position()的区别
- jquery中position 和offset的区别
- jquery offset与position
- jQuery获得元素位置offset()和position()的区别
- offset()和position()的区别
- offset和position的区别
- JQ之 offset 和 position 的用法与区别
- JQ之 offset 和 position 的用法与区别
- Jquery中的offset()和position()方法详解
- jQuery中offset和position方法
- 线程安全 问题 如何判断一个类是否是线程安全的
- AngularJS内幕详解之 Scope
- jquery 连接打印机
- Codeforces刷题之路——467A George and Accommodation
- VS 中图像插件的使用(OpenCV)
- jQuery方法区别(二)position()与offset()区别
- Maven项目搭建Spring MVC框架
- 百度地图开发之隐藏相关百度控件
- GUI类 只能在主线程中被使用,不能跨线程使用
- 查询昨天、今天、明天和本周的记录和更久的
- Java多线程知识小抄集(三)
- Cygwin安装类似apt-get的包管理工具——apt-cyg
- 1.1解决Android studio中 java.lang.UnsatisfiedLinkError couldn't find "libcsiipowerenter.so问题
- c++的构造函数初始化列表