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