0

問題があります。最初にこのHTMLを見てください

<div id="map" style="background-image: url(map.png); width: 700; height: 600;">
  <div id="dot1" onMouseOver=expand(this) onMouseOut=shrink(this)></div>
  <div id="dot2" onMouseOver=expand(this) onMouseOut=shrink(this)></div>
</div>

次のJSコードがあります

function expand(element) {
  element.style.height = '100px';
}
function shrink(element) {
  element.style.height = '20px';
}

IDEAは次のとおりです。100x100に拡大し、このスポットの周りに白い背景とテキストが表示されるように、マウスの上の地図とその上の複数の「赤い点」を想像してください。唯一の問題は、他のドットの1つが展開されているときに、他のドットをマップに貼り付ける方法です。

たとえば、ユーザーが「一番上の」スポットを探していて、現在のスポットの下にある他のすべてのスポットが約100px下に移動しています（最初のスポットを拡大する正確な量）

それは 位置でうまく見えます：相対的ですが、あなたが中を見ていない間だけです。
絶対/固定？-オプションが正しくありません。ユーザーの画面サイズ/クライアントサイズを計算してすべての「ドット」を
配置するか、MAPの左/上オフセットを計算してすべてのドットをmap_offset_Left+myLeftにする必要があります

たぶん、それらをMAP divから依存させ、互いに独立させる方法はありますか？

Ty

4

1 に答える 1

1

マップをに設定するとposition: relative、その絶対位置の子孫は、ウィンドウではなくマップに対して配置されます。

于 2012-06-13T12:53:40.237 に答える