jquery - заставить div появляться там, где я нажимаю

Question

Эй, я пытаюсь сделать небольшую функцию, где я могу нажать на значок, и появится окно, похожее на лайтбокс, но закрепленное на значке. Есть ли способ

1. Скажите, где находится значок на экране, а затем
2. Поместите верхний левый угол моего ящика там, где находится значок, а затем
3. В этом месте появился мой ящик?

Спасибо!

Answer 1

// 1.Tell where the icon is on the screen
var off = $("#iconId").offset();

// 2.Have the top left corner of my box placed where the icon is
var div = $("#divId");
div.css({ position: "absolute", top: off.top, left: off.left });

// 3.Have my box appear in that location?
div.show();

Answer 2

$(function() {
    $("#icon").click(function(){
        var offset = $(this).offset();
        $("#pop").css("position","absolute").css("top",offset.top+$(this).height()).css("left",offset.left);
        $("#pop").show();
    });
});

смещение возвращает вам положение вашего значка, а затем вы используете эти значения для установки верхнего и левого смещений для вашего всплывающего окна