Создать элемент в абсолютном положении?

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

Если вы хотите, прилагается ниже первого тега привязки, вы можете попробовать -

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

EDIT: Как было предложено ОП:
добавить position: absolute и z-index: 999, чтобы разместить его на улице.

Answer 2

Я бы взглянуть на $.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});