0

私は2つの画像を含むdivを持っています。1つは一種の地図で、もう1つはピンポイント画像です。JavaScriptを使用してマウスクリックをx、y座標としてキャプチャし、ピンポイントはクリックとともに簡単に移動しました。コードは次のようになります。

<div id="areapage" onclick="javascript:SetValues();" style="display: none;">
  <img src="mysource" style="width:420;position:relative;" >
  <img id="pindiv" src="images/pin.png" style="position: absolute;top: 0;left: 0;"> 
</div>

<script>
    function SetValues()
{

        document.getElementById('pindiv').style.left = window.event.screenX + 'px';
        document.getElementById('pindiv').style.top = window.event.screenY + 'px';

}
</script>

ファンシーボックス内に配置するまでは完全に機能しましたが、明らかに何かが変更されました。おそらくx、yは、ファンシーボックスを開いたバックグラウンドの元のドキュメントを参照していますか？

4

1 に答える 1

0

#areapage divをposition：relativeに設定してみてください。これにより、pindivの絶対位置は、親ではなくそのdivに基づきます。

于 2012-10-31T14:15:18.487 に答える