コメント表示(1)



JavaScript

ボタンの上にマウスを置くと、コメントが表示されます。

<SCRIPT LANGUAGE=javascript>
<!--
var msgTb = new Array();
msgTb[0] = "こはく色の透明な醤油です。";
msgTb[1] = "大豆が主原料の醤油です。";
msgTb[2] = "普通の醤油です。";
msgTb[3] = "塩分濃度は濃口醤油より濃い醤油です。";
msgTb[4] = "甘露醤油とも言われています。";
msgTb[5] = "八丁味噌が有名です。";
msgTb[6] = "田舎味噌とも呼ばれています。";
msgTb[7] = "ポピラーな味噌です。";

function msgS0(x,y,ii){
 m0.style.posLeft = x + 5;
 m0.style.posTop = y + 5;
 m0.style.padding = 10;
 m0.innerHTML = msgTb[ii];
 m0.style.backgroundColor = "#00aadd";
 m0.style.visibility = "visible";
}

function msgH0(){
 m0.style.visibility = "hidden";
}

//-->
</SCRIPT>
//
<table border="1" width="60%" height="120">
<tr>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="白醤油" name="B1" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,0)" onmouseout="msgH0()"></td>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="溜醤油" name="B2" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,1)" onmouseout="msgH0()"></td>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="濃口醤油" name="B3" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,2)" onmouseout="msgH0()"></td>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="淡口醤油" name="B4" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,3)" onmouseout="msgH0()"></td>
</tr>
<tr>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="再仕込醤油" name="B5" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,4)" onmouseout="msgH0()"></td>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="豆味噌" name="B6" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,5)" onmouseout="msgH0()"></td>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="麦味噌" name="B7" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,6)" onmouseout="msgH0()"></td>
<td width="25%" bgcolor="#FDF8B5" height="40" align="center"><input type="button" value="米味噌" name="B8" LANGUAGE=javascript onmouseover="msgS0(event.x,event.y,7)" onmouseout="msgH0()"></td>
</tr>
</table>
<DIV id="m0" style="position:absolute;padding:10px"></DIV>
注1)JavaScriptで処理しています。JavaScript対応ブラウウザでご使用下さい。
注2)IE4.0以上で動作可能です。



00/05/22更新

戻る