|
|
| サンプルソース |
|---|
| <!--HTMLタグ </HEAD>の下に挿入してください。--> |
| <BODY text="#000000" bgcolor="#FFFFFF" link="#ffffff"
vlink="#ffffff" alink="#ff00ff"> <DIV id="menu0" style="position:absolute; left : 12px; top : 37px; width : 75px; height : 114px; z-index:1; visibility : hidden; background-color : green; "><BR> <FONT color="#FFFFFF">├ 政治<BR> ├ 官公庁<BR> ├ 自治体<BR> ├ 憲法<BR> └ 法律</FONT><BR> <BR> </DIV> <DIV id="menu1" style="position:absolute; left : 97px; top : 37px; width : 75px; height : 143px; z-index : 2; visibility:hidden; background-color : green; "><FONT color="#FFFFFF"><BR> ├ ニュ-ス<BR> ├ 野球<BR> ├ サッカ-<BR> ├ ゴルフ<BR> ├ F1<BR> ├ 釣り<BR> └ バレ-</FONT><BR> <BR> </DIV> <DIV id="menu2" style="position:absolute; left : 187px; top : 37px; width : 75px; height : 110px; z-index : 3; visibility:hidden; background-color : green; "><FONT color="#FFFFFF"><BR> ├ 国内<BR> ├ 海外<BR> ├ ホテル<BR> ├ 温泉<BR> └ 観光地<BR> </FONT><BR> </DIV> <DIV id="menu3" style="position:absolute; left : 270px; top : 37px; width : 75px; height : 112px; z-index : 4; visibility:hidden; background-color : green; "><FONT color="#FFFFFF"><BR> ├ 国内<BR> ├ 海外<BR> ├ ホテル<BR> ├ 温泉<BR> └ 観光地<BR> </FONT><BR> </DIV> <DIV id="menu4" style="position:absolute; left : 362px; top : 38px; width : 75px; height : 82px; z-index : 5; visibility:hidden; background-color : green; "><FONT color="#FFFFFF"><BR> ├ ニュ-ス<BR> ├ 新聞<BR> └ テレビ</FONT><BR> <BR> </DIV> <TABLE bgcolor="#006633" height="11"> <TBODY> <TR> <TD width="95"><A href="#" onmouseover="Show_obj('menu0')" onmouseout="Hide_obj('menu0')"><B>政治,法律</B></A></TD> <TD width="71"><A href="#" onmouseover="Show_obj('menu1')" onmouseout="Hide_obj('menu1')"><B>スポ-ツ</B></A></TD> <TD width="83"><A href="#" onmouseover="Show_obj('menu2')" onmouseout="Hide_obj('menu2')"><B>旅行,地域</B></A></TD> <TD width="90"><A href="#" onmouseover="Show_obj('menu3')" onmouseout="Hide_obj('menu3')"><B>医療.健康</B></A></TD> <TD width="53"><A href="#" onmouseover="Show_obj('menu4')" onmouseout="Hide_obj('menu4')"><B>報道</B></A></TD> </TR> </TBODY> </TABLE> </BODY> |
| <!--Ｊａｖａｓｃｒｉｐｔ <HEAD>と</HEAD>の間に挿入してください。 --> |
| <SCRIPT language="JavaScript"> <!--eelife flag="menu0"; function get_Browser(Lyid){ // ブラウザの取得 if (document.getElementById) myObj=document.getElementById(Lyid).style; // N6 else if (document.all) myObj=document.all[Lyid].style; // IE else if (document.layers) myObj=document[Lyid]; // N4 } function Show_obj( Lyid ) { // マウスが乗った時サブメニューを表示 get_Browser(Lyid); // ブラウザオブジェクト myObj.visibility = "visible"; // 表示 if( flag== Lyid){}; else Hide_obj(flag); flag= Lyid; } function Hide_obj( Lyid ) { // マウスが離れた時サブメニューを非表示 get_Browser(Lyid); // ブラウザオブジェクト myObj.visibility ="hidden"; // 非表示 } // --> </SCRIPT> |
| コメント |
| onmouseover="Show_obj('menu0')" : マウスが乗った時 ID名が 'menu0'
のレイヤーを表示します。 onmouseout="Hide_obj('menu0')" : マウスが離れた時 ID名が 'menu0' のレイヤーを非表示にします。 レイヤーの作成 |