テーブルの位置情報

質問

javascriptで現在のテーブルの位置を知ることは可能なのでしょうか？また各セルの位置情報も同じく知ることはできるのでしょうか？（幅や高さではなく、絶対位置です）　よろしくご指導お願い致します。

回答No.2

387 · ベストアンサー

Netscape 4.x の場合ですと、layer タグで括ってレイヤーの left プロパティと
top プロパティで代用するしかないと思います。

<layer id="table1">
<table align="center">
<tr>
<td>あ</td>
<td>い</td>
</tr>
<tr>
<td>う</td>
<td>え</td>
</tr>
</table>
</layer>
<form onsubmit="return false">
<input type="button" onclick="alert( '左 : ' + document.layers[ 'table1' ].left + 'px、上 ： ' + document.layers[ 'table1' ].top + 'px' )" value="テーブルの位置を取得">
</form>

しかし、困った事に左位置が期待している値にならないようです。
※ テーブルの横幅は（表示されている幅に関わらず）
「 ウィンドウ幅いっぱい 」－「body 内側のマージン値」となっている模様

更に困った事に、レイヤーは Netscape 6 で廃止されています。

Netscape 6.x の場合ですと、以下のようにすると取得できます。

<table id="table1" align="center">
<tr>
<td>あ</td>
<td>い</td>
</tr>
<tr>
<td>う</td>
<td>え</td>
</tr>
</table>
<form onsubmit="return false">
<input type="button" onclick="alert( '左 : ' + document.getElementById( 'table1' ).offsetLeft + 'px、上 ： ' + document.getElementById( 'table1' ).offsetTop + 'px' )" value="テーブルの位置を取得">
</form>

これで取得してもやはり左位置は期待している値にはなりません。
このサンプルは IE 6 でも動作しますが、その場合の左位置は期待した値になりますので、
やはり、Netscape ではテーブルの実際の幅は
「 ウィンドウ幅いっぱい 」－「 body 内側のマージン値 」として扱われているようです。

お礼

丁寧な回答ありがとうございました！Netscapeはちょっと違うんですね。他の対応を考えます。

回答No.1

387

左上点の位置でよければ、offsetLeft プロパティで左からの位置が、
offsetTop プロパティで上からの位置が取得できます。

<table id="table1" align="center">
<tr>
<td>あ</td>
<td>い</td>
</tr>
<tr>
<td>う</td>
<td>え</td>
</tr>
</table>
<form onsubmit="return false">
<input type="button" onclick="alert( '左 : ' + document.all[ 'table1' ].offsetLeft + 'px、上 ： ' + document.all[ 'table1' ].offsetTop + 'px' )" value="テーブルの位置を取得">
</form>

補足

ご回答ありがとうございます。補足質問なのですが、Netscape4の場合offsetLeftが使えないのですが、なにか代用のものがあればお教えください。よろしくおねがいします。