码迷,mamicode.com
首页 > Web开发 > 详细

jquery 中的 offset()

时间:2016-06-06 16:40:46      阅读:213      评论:0      收藏:0      [点我收藏+]

标签:

一.语法:

1.返回偏移坐标

  $(select).offset();

  top:  $(select).offset().top;

  left:  $(select).offset().left;

 

2.设置偏移坐标

   $(select).offset({top:value,left:value});

   参数的含义:

   {top:value,left:value} 当设置偏移时是必需的。规定以像素为单位的 top 和 left 坐标。

 

  3、使用函数设置偏移坐标:

        $(selector).offset(function(index,currentoffset));

        可选。规定返回包含 top 和 left 坐标的对象的函数。
        index - 返回集合中元素的 index 位置。
        currentoffset - 返回被选元素的当前坐标。

 

二. 实例

 <!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){

      名/值 对
       $("button").click(function(){
             $("p").offset({top:200,left:200});
       });

     对象

$("button").click(function(){
newPos=new Object();
newPos.left="0";
newPos.top="100";
$("p").offset(newPos);
});

      函数

$("p").offset(function(n,c){
newPos=new Object();
newPos.left=c.left+100;
newPos.top=c.top+100;
return newPos;
});


});
</script>
</head>
<body>

<p style="border:1px solid red">This is a paragraph.</p>
<button>Set the offset coordinates of the p element</button>

</body>
</html>

 

三.注意事项

ffset() 方法 返回的top , left. 跟 margin-top,margin-left 也有关系。

      如果元素有margin-top,margin-left. 它获取当前的margin. 没有则是默认取值。

      如果父元素也有margin,broder 的话。它也会受到影响。取值要更大。 因为offset() 取的当前与文档的偏移坐标。

jquery 中的 offset()

标签:

原文地址:http://www.cnblogs.com/vvWeb/p/5564098.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!