Question

我正在尝试将一个元素插入到DOM中，本质上是一个浮动框。完全在正常的元素流之外，重叠在它下面的任何东西，在特定的位置。

我在尝试：

$('body').append('<div id="popup" style="width:30px; height:30px;">HEY THERE</div>');
$('#popup').position({ my: 'left top', at: 'left bottom', of: $('a').first() });

但是没有得到任何结果。我正试图将浮动框直接放在文档中的第一个锚标记下面。

它已被放入DOM，但它没有被正确定位。

可能我应该使用insert，或某种相对和绝对定位的组合？

Answer 1

我会看看$.offset()：

var a = $('a').first(); 
var offset = a.offset(); 
var aLeft = parseInt(offset.left); 
var aTop = parseInt(offset.top); 

//And I have never used .position() I would edit the CSS: 
$("#popup").css({left: aLeft + 10, top: aTop + 10, position: "absolute", z-index: 1000});

Answer 2

如果您希望将其附加到第一个锚标记下方，可以尝试 -

$("a").first().after('<div id="popup" style="width:30px; height:30px;">HEY THERE</div>');

编辑：如OP所示：
添加position: absolute和z-index: 999将其放在外面。

在绝对位置创建元素？

2 个答案: