jquery координирует проблемы с изображением с абсолютным расположением div

Question

У меня проблема с записью координат x и y с использованием jQuery/javascript на изображении, которое находится в контейнере 'position: absolute div'.

В основном то, что должно произойти, находится где-то на изображении, и на эти координаты размещается информация, содержащая div.

Однако, когда контейнер div изображения имеет абсолютную позицию, координаты x и y выключены, но это должно быть там, чтобы наложить изображение с помощью div div, если только кто-то не может думать о лучшем способе?

ниже мой код, любая помощь оценили

<style> 
    #image_container {position: absolute} 
    #test_img {} 
    .image_dot { height: 5px; width: 5px; background-color: red; position: absolute; } 
</style> 

<div id="image_container"> 
    <img src="mrt.jpg" id="test_img" /> 
</div> 
<script type="text/javascript"> 
     $("#test_img").click(function(event) { 
     var x = event.pageX - this.offsetLeft; 
     var y = event.pageY - this.offsetTop; 
     $("#image_container").append('<div class="image_dot" id="uniqueid" style="display: none;">Some text</div>'); 
     $("#unqiueid").css("top",x+"px").css("left",y+"px").show(); 
    }); 
</script> 

Answer 1

Я не уверен, если это будет работать, так как у меня нет времени, чтобы создать тест-дело, но я думаю, если возможно, вы должны просто дайте пузырьку события click() до элемента body. Например:

$(body).click(function(e) { 
    var x = event.pageX; 
    var y = event.pageY; 
    $("body").append('<div class="image_dot" id="uniqueid" style="display: none;">Some text</div>'); 
    $("#unqiueid").css("top",x+"px").css("left",y+"px").show(); 
} 

Если все только позиционируется абсолютным в любом случае (и не родственник), это не имеет значения, и я верю, что вы должны получить лучшие значения pageX и Пейджи с помощью body (или, может быть window?).

Как я уже сказал, у меня не было возможности проверить это. Дайте мне знать, если это сработает!