jQuery中position()與offset()區別


position()獲取相對於它最近的具有相對位置(position:relative或position:absolute)的父級元素的距離,如果找不到這樣的元素,則返回相對於瀏覽器的距離。

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或position:absolute)的位置

var vposition = $("#inner").position();
alert(vposition.left); //輸出:50
alert(vposition.top); //輸出:60
 var voffset = $("#inner").offset();
alert(voffset.left); //輸出:$("#outer").offset().left+50
 alert(voffset.top); //輸出:$("#outer").offset().top+60

在不同瀏覽器中,offset()得到的相對於瀏覽器的位置不同,相信你看了上邊相應的注釋,已經掌握了position()同offset()方法的區別。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM