如何將對象附加到圖像上的固定位置？

Question

到目前爲止，我只想出如何將對象放置到頁面座標的固定位置。
這裏是問題：

當我移動圖像（對象是你可以點擊的圖像上的點）向上/向下/向左/向右時，點位於舊位置。

那麼有沒有辦法讓他們從圖像的座標？然後我可以移動img，點數將保持在原來的位置，對嗎？

這是我的觀點（CSS）：

div.point { 
    border-radius: 50%; 
    width: 28px; 
    height: 28px; 
    background: #7ab51d; 
    border: 3px solid white; 
    position: fixed; 
    z-index:1000; 
    cursor: pointer; 
} 

這些我怎麼定位他們：

<div id="Restroom_Water" class="point" style="top:380px;left:1000px;" onmouseover="$('#Restroom_text_Water').show();" onmouseout="$('#Restroom_text_Water').hide();"></div> 

Answer 1

改變位置屬性：

div.point{ 
    position: relative; 
} 

這意味着的像素位置點對象是相對於父容器（在這種情況下是您的圖像）。

This article重新定位很好。