在點擊位置創建一個彈出窗口

Question

我在我的網站上有一個畫布元素，用戶可以在其中選擇幾件事情。爲了更多選擇如何處理所選擇的東西，我想創建一個帶有幾個選項的小彈出窗口。不幸的是，我無法將彈出窗口放在與點擊位置相同的位置。

我的第一種方法是做一個div的彈出。 我有一個div：

<div id = "popup" style="visibility: hidden"> 
    text 
    </div> 

要改變div的身份和地位我用這個代碼：

$(popupDiv).offset({ top: mousePos.y, left: mousePos.x}); 

不幸的是，在div彈出位置是不相似的地方應該是。

任何想法爲什麼？

Answer 1

確保您的#popup div是position: absolute而不是relative。否則，其偏移量將相對於塊元素已被繪製的位置。

這是一個基本的小提琴：jsFiddle

編輯：應該提到 - 如果你不指定absolute自己，使用.offset()方法時，它會自動使用relative。