jQuery中的offset方法可以獲取或設(shè)置文檔中某個(gè)元素相對(duì)于文檔的偏移量,也就是元素左上角相對(duì)于文檔左上角的距離。
//獲取元素相對(duì)于文檔的偏移量 var offset = $('#example').offset();
要設(shè)置元素的偏移量,可以使用offset方法的兩個(gè)參數(shù):top和left。
//設(shè)置元素相對(duì)于文檔的偏移量 $('#example').offset({top: 100, left: 200});
當(dāng)然,也可以使用offset方法的回調(diào)函數(shù),動(dòng)態(tài)地修改元素的位置。
//動(dòng)態(tài)修改元素位置 $('#example').offset(function(index, oldOffset) { return { top: oldOffset.top + 50, left: oldOffset.left + 30 }; });
需要注意的是,offset方法返回的是該元素的當(dāng)前偏移位置,而不是相對(duì)于文檔左上角的固定偏移量。
//獲取元素當(dāng)前位置 var offset = $('#example').offset(); console.log('當(dāng)前位置', offset); //滾動(dòng)頁(yè)面后再次獲取元素位置 $(window).scroll(function() { var offset2 = $('#example').offset(); console.log('滾動(dòng)后位置', offset2); });
這段代碼可以看到,在頁(yè)面滾動(dòng)后,元素雖然相對(duì)于文檔的左上角位置沒(méi)有變化,但是偏移量卻發(fā)生了改變。