使用jQuery獲取和設置位置.offset（）

102

如何使用jQuery .offset方法獲取和設置元素的位置？使用jQuery獲取和設置位置.offset（）

比方說，我有一個div和另一個layer2。我如何獲得的位置並將其設置爲layer2？

來源

2011-01-06 Denise

丹尼斯，你甚至檢查.offset（）方法jQuery的網站？另外，你爲什麼不接受Steve的答案？ – Rafid 2012-12-04 09:44:20

@Rafid她基本上從來沒有回來 – jcollum 2013-10-14 20:47:25

我可以有她的觀點嗎？ – ganders 2014-07-09 20:16:25

182

//Get 
var p = $("#elementId"); 
var offset = p.offset(); 

//set 
$("#secondElementId").offset({ top: offset.top, left: offset.left});

來源

2011-01-06 09:09:16 Steve

很好，清楚/乾淨的答案。 – sabiland 2012-12-13 12:49:46

這是可行的，但你要知道，使用offset()設置元素相對於文檔中的位置：

$('.layer1').offset($('.layer2').offset());

來源

2011-01-06 09:10:29

我推薦另一種選擇。 jQuery UI有一個新的位置功能，允許您相對於彼此定位元素。有關完整的文檔和演示，請參閱：http://jqueryui.com/demos/position/#option-offset。

這裏有一種方法使用位置功能，定位您的元素：

var options = { 
    "my": "top left", 
    "at": "top left", 
    "of": ".layer1" 
}; 
$(".layer2").position(options);

來源

2011-11-14 18:21:15 KSev

這是一個選項。這僅用於x座標。

var div1Pos = $("#div1").offset(); 
var div1X = div1Pos.left; 
$('#div2').css({left: div1X});

來源

2013-03-04 20:50:16 hillspro

var redBox = $(".post"); 

var greenBox = $(".post1"); 

var offset = redBox.offset(); 

$(".post1").css({'left': +offset.left}); 
$(".post1").html("Left :" +offset.left);

http://jsfiddle.net/va836/159/

來源

2017-04-29 19:29:56

使用jQuery獲取和設置位置.offset（）

回答

相關問題