マウスオーバーでテーブル表示

質問

タイトル通りのことがしたくて、以下のようにしてみたのですが、表示されません。
どこがダメなのか教えてください。
（マウスオーバーで画像表示、はできるようになったんですが。。。）

<script language="JavaScript">
function table(object,hyoji){
document.[object].style.visibility=hyoji
}
</script>

<img src="onMouseOver('TABLE1','visible');">

<SPAN STYLE="POSITION:ABSOLUTE; TOP:30; LEFT:40; filter: Alpha(opacity=60); visibility='hidden';">
<TABLE CLASS="SETSUMEI" NAME="TABLE1">
<TR><TD CLASS="SETSUMEI">TOPページに<BR>戻ります。</TD></TR></TABLE></SPAN>

テーブルって名前つけられたんだっけ…？とかいろいろ不安なところはありますが、
よろしくお願いします。

回答No.1

noname#199778 · ベストアンサー

全体的に問題があると思います…

ご質問で求めているような動作をより多くのブラウザ上で実現するには、DOMと呼ばれるインターフェイスを使って、解決する必要があると思います。 そのため、イメージを差し替えるJavascriptとは根本的に異なるソースの書き方をする必要があります。

諸々の所を修正したソースを以下に。

<script language="JavaScript">
function showtable(targetId,hyoji){
if (document.getElementById){
document.getElementById(targetId).style.visibility=hyoji;
}
}
</script>

<img src="hoge.jpg" onMouseOver="showtable('TABLE1','visible')" onMouseout="showtable('TABLE1','hidden')">

<div id="TABLE1" style="position: absolute; top: 30px; left: 40px; filter: Alpha(opacity=60); visibility: hidden;">
<TABLE CLASS="SETSUMEI">
<TR><TD CLASS="SETSUMEI">TOPページに<BR>戻ります。</TD></TR></TABLE>
</div>

おそらくこれで目的の動作を確保できると思いますが、いかがでしょうか。 (ソース内容の説明などについては、少々複雑になるので、ここでは割愛します。)

参考になれば。

お礼

回答ありがとうございます。

実は現在つくっているものは、IEの6.0か5.5でしか見ないものなので、比較的インターフェイスにおいては深く考える必要がないページなんです。

ご指摘通りにしてみたら無事できました。
ありがとうございました。