jQuery的position()方法详解
position()方法的定义和用法:
此方法获取匹配元素相对某些元素的偏移量。
返回的对象包含两个整型属性（top和left）的对象。
此方法只对可见元素有效。
语法结构:
$(selector).position()
在教程的开头之所以说是获取匹配元素相对于某些元素的偏移量。很多教程都说方法返回的偏移量是相对于父元素，其实并非完全如此，此方法会将匹配元素以绝对定位方式处理，当然并不是说真的将匹配元素设置为绝对定位。方法的偏移量参考原则如下:
1.如果父辈元素中没有采用定位的（position属性值为relative、absolute或者fixed），那么偏移量参考对象为窗口。
2.如果父辈元素中有采用定位的，那么偏移量的参考对象为距离它最近的采用定位的元素，
实例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<style type="text/css">
*{
margin:0px;
padding:0px;
}
.father{
background-color:green;
width:200px;
height:200px;
padding:50px;
margin-bottom:50px;
margin-left:100px;
}
.children{
height:150px;
width:150px;
background-color:red;
line-height:150px;
text-align:center;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".children").each(function(){
var text;
text="left:"+$(this).position().left;
text+="top:"+$(this).position().top;
$(this).text(text);
})
})
</script>
</head>
<body>
<div class="father" style="position:relative">
<div class="children"></div>
</div>
<div class="father">
<div class="children"></div>
</div>
</body>
</html>
在以上代码中顶部组合，由于父元素采用的是相对定位，那么获取的偏移量就是相对于父元素的。在底部的组合中，由于父元素没有采用定位，那么偏移量参考对象就是窗口。
以上所述就是本文的全部内容了，希望大家能够喜欢。
-
本文向大家介绍jQuery position() 函数详解以及jQuery中position函数的应用，包括了jQuery position() 函数详解以及jQuery中position函数的应用的使用技巧和注意事项，需要的朋友参考一下 position()函数用于返回当前匹配元素相对于其被定位的祖辈元素的偏移，也就是相对于被定位的祖辈元素的坐标。该函数只对可见元素有效。 所谓"被定位的元素"，
-
本文向大家介绍jQuery Position方法使用和兼容性，包括了jQuery Position方法使用和兼容性的使用技巧和注意事项，需要的朋友参考一下 1、position方法 jquery api地址：http://jquery.cuishifeng.cn/position.html position方法获取匹配元素相对父元素的偏移。 2、说明 2.1 与offset()区别 .offset
-
本文向大家介绍详解jQuery-each()方法，包括了详解jQuery-each()方法的使用技巧和注意事项，需要的朋友参考一下 jquery中有隐式迭代，不需要我们再次对某些元素进行操作。但是如果涉及到不同元素有不同操作，需要进行each遍历。本文利用10个li设置不同的透明度的案例，对each方法进行说明。 语法： $(元素).each(function(index,element){ }
-
所属类别 方法重载（Method Overrides） | 方法（Methods） | 实用工具（Utilities） 用法 描述：相对另一个元素定位一个元素。 返回：jQuery 版本新增：1.8.position( options ) 参数 类型 描述 options Object my（默认值："center"） 类型：String 描述：定义被定位元素上对准目标元素的位置："horizon
-
本文向大家介绍jQuery中delegate()方法的用法详解，包括了jQuery中delegate()方法的用法详解的使用技巧和注意事项，需要的朋友参考一下 delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。下面我们具体来了解一下。 语法结构: 代码如下: 参数说明： childSelector 必需。规定要附加事件处理程
-
本文向大家介绍jQuery的end()方法使用详解，包括了jQuery的end()方法使用详解的使用技巧和注意事项，需要的朋友参考一下 end()方法的定义和用法: end()方法能够回到最近的一个"破坏性"操作之前，即将匹配的元素列表变为前一次的状态。 如果没有破坏性操作将返回一个空集。 破坏性操作的概念:指任何改变所匹配元素的操作。可能大家对这个概念比较模糊，举个例子: 以上代码的CSS函数就