javascript - e.PageX と e.PageY の値を使用してピンの上に情報ウィンドウを配置する方法は?

Question

カスタム情報ウィンドウを使用してマップを作成しています。ピンのクリックされたイベント pageX および PageY 値に基づいて情報ウィンドウを配置しようとしていますが、これを適切に達成する方法がわかりません。現時点では、すべての計算がランダムな位置まで試行されます。 .

JS

Microsoft.Maps.Events.addHandler(pin, 'click', function(e) {
     instance.displayInfoBox(e, pin, response);
});

$itemOverlay.css({

    top: e.pageX,
    left: e.pageY

}).show();

CSS

.item-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: auto;
    background: white;
    padding: 10px;
    display: none;
}

JSFiddle : http://jsfiddle.net/upej8/13/

Answer 1

座標を混合しました。スタイルは次のようになります。

$itemOverlay.css({

  top:  e.pageY,
  left: e.pageX
}).show();