jQuery位置函数

1.offset()

获取匹配元素在当前视口的相对偏移。

返回的对象包含两个整形属性：top 和 left。此方法只对可见元素有效。

例子：

css:

.divTxt{ width:500px; height:500px; background:#f60; border:10px solid #000; margin:100px 0 0 100px; text-align:center; line-height:500px;}

<script> 
var divPos = $(".divTxt").offset();
var PosL = divPos.left;
var PosT = divPos.top;
$(".divTxt").html("Left:" +PosL+",Top:" + PosT);
</script>

显示结果：

 

 

2.innerWidth（）

获取第一个匹配元素内部区域宽度（包括补白、不包括边框）。

此方法对可见和隐藏元素均有效。

返回值：整型数据

例子：

HTML同上

<script> 
var divPos = $(".divTxt").innerWidth();
$(".divTxt").html("宽度:" +divPos);
</script>

显示结果：

 

 

 3.innerHeight（）

获取第一个匹配元素内部区域高度（包括补白、不包括边框）。

此方法对可见和隐藏元素均有效。

返回值：整型数据

4.outerWidth（）

 

获取第一个匹配元素外部宽度（默认包括补白和边框）。

此方法对可见和隐藏元素均有效。

返回值：整型数据

HTML 同上

<script> 
var divPos = $(".divTxt").outerWidth();
$(".divTxt").html("宽度:" +divPos);
</script>

显示结果：

 

5.outerHeight()

获取第一个匹配元素外部高度（默认包括补白和边框）。

此方法对可见和隐藏元素均有效。

返回值：整型数据

 6.scrollTop（）

获取匹配元素相对滚动条顶部的偏移。

HTMl：同上

<script> 
$(this).scroll(function(){
var divPos = $(this).scrollTop();
 alert(divPos)
})
</script>

 

 

 7.scrollLeft（）

获取匹配元素相对滚动条左侧的偏移

 

 

 

8.相关javascript 位置

 

网页可见区域宽： document.body.clientWidth;
网页可见区域高： document.body.clientHeight;
网页可见区域宽： document.body.offsetWidth   (包括边线的宽);
网页可见区域高： document.body.offsetHeight (包括边线的宽);
网页正文全文宽： document.body.scrollWidth;
网页正文全文高： document.body.scrollHeight;
网页被卷去的高： document.body.scrollTop;
网页被卷去的左： document.body.scrollLeft;
网页正文部分上： window.screenTop;
网页正文部分左： window.screenLeft;
屏幕分辨率的高： window.screen.height;
屏幕分辨率的宽： window.screen.width;
屏幕可用工作区高度： window.screen.availHeight;
屏幕可用工作区宽度：window.screen.availWidth;

浮标：

HTML：css：同上

<script> 
$(this).scroll(function(){
 var divPos = $(this).scrollTop();

 if(divPos == 0){
  $(".t1").css({display:"none"});//当网页在顶部时，t1层隐藏
 }
 else{
   $(".t1").css({display:"block"});
   $(".t1").css("top",100 + $(this).scrollTop());
         $(".t1").css("left",100 + $(this).scrollLeft());
 }

})

</script>