javascript - クリック時にキャンバスの上に div をフロートさせるコード

Question

HTML5 キャンバス要素とクリック用のイベント リスナーがあります。必要なのは、ユーザーがキャンバスをクリックした場所に表示されるフローティング div にこれをリンクすることです。これを行うための最良の方法のためのコードの提案?

私はマウスの位置を追跡しています：

        var pos = getMousePos(canvas, evt);
        mousePos.x = pos.x;
        mousePos.y = pos.y;

Answer 1

これでうまくいくはずです：

HTML：

<div style="position: relative">
    <canvas />
    <div style="position: absolute" id="floatingDiv">Floating div</div>
</div>

Javascript：

var pos = getMousePos(canvas, evt);
mousePos.x = pos.x;
mousePos.y = pos.y;
var floatingDiv = document.getElementById('floatingDiv');
floatingDiv.style.top = pos.y + 'px';
floatingDiv.style.left = pos.x + 'px';