0

我正在尝试在元素 A 之上设置元素 B 的绝对位置。我有

var left = $('#elementA').offset().left;

var top  = $('#elementA').offset().top;


---------------------------
|    -----------           |    
|   |o          |          |        
|   |           |          |
|   |           |          |
|   |           |          |    
|    -----------           |
|--------------------------

o 表示我的元素A。

我想将元素 B 放在与元素 A 相同的位置

$('elementB').css({ position:'absolute',
            top:top,
            left:left}) 


---------------------------
|    -----------          | 
|   |o          |         |     
|   |  b        |         |
|   |           |         |
|   |           |         | 
|    -----------          |
|--------------------------
b means my element b

但事实证明如上。

如果我设置

$('elementB').css({ position:'absolute',
            top:0,
            left:0})

它会起作用的。但我有许多不同的元素 B 和元素 A，我不能对所有元素都使用 0。

任何人都可以帮助我吗？非常感谢！

4

3 回答 3

1

您可以使用 jQuery UI Position 插件来相对于任何其他元素定位任何元素。请参阅：http ://docs.jquery.com/UI/Position

在您的情况下，它将是：

$('#elementB').position({
  my: 'left top',
  at: 'left top',
  of: '#elementA'
});

另外我认为将'px'添加到css属性的值是一个好习惯，例如：

$('...').css({
    left: 100 + 'px'
});

如上所述，您应该始终考虑相对于彼此的元素配置。如果父元素是“定位的”，那么子元素的定位不是相对于窗口，而是相对于它们的父元素。如果您想要更多的灵活性，您可以将元素 B 从元素 A 中取出（使它们成为兄弟）。

于 2012-08-14T19:12:17.677 回答
0

函数 offset() 将为您提供窗口中元素的偏移量。您需要的是 elementA 在其容器内的相对偏移量。

尝试使用 position() 而不是 offset()

基于另一个例子：http: //jsfiddle.net/dcFXj/

于 2012-08-14T18:56:33.327 回答
0

当一个元素是另一个元素的子元素时，绝对定位对于窗口来说并不是绝对的，而是相对于其父元素的绝对定位。如果您希望 div 的左上角与它的父级左上角完美匹配，那么您希望它top与left父级的距离正好为零像素。它只是绝对的，因为它忽略了可能将其移出位置的所有其他项目。

这是实际操作的演示

当 B 是 A 的孩子时，对于 B 需要与 A 对齐的每种情况，只需始终将其左上角设置为 0。

于 2012-08-14T19:01:24.280 回答