便利eelife Java Script

   戻る

画面上をクリックしてください。



サンプルソース
<!--HTMLタグ </HEAD>の下に挿入してください。-->
<BODY >
<DIV id="MENU0" style="position:absolute;top : 56px;left : 157px;visibility:hidden;background-color : #defddb;width : 44px;
z-index : 1;
height : 70px;
">
<TABLE border="1">
<TBODY>
<TR>
<TD width="92"><A href="../index.html">便利eelife</A></TD>
</TR>
<TR>
<TD width="92"><A href="../color/color_top.html">ColorRoom</A></TD>
</TR>
<TR>
<TD width="92"><A href="java_top.html">JavaScript</A></TD>
</TR>
</TBODY>
</TABLE>
</DIV>

</BODY>
<!--Javascript <HEAD>と</HEAD>の間に挿入してください。 -->
<SCRIPT language="JavaScript">
<!--eelife
window.document.onclick = Show_menu;  //  画面をクリックした時 Show_menu()を実行
flag = true;

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_menu()    // x、yの位置にオブジェクトを移動
{Lyid="MENU0";
get_Browser(Lyid);
myObj.left = event.x;  
myObj.top = event.y;  

if (flag==true) myObj.visibility = "visible";  //  flagがtrueならオブジェクトを表示
else myObj.visibility = "hidden";              //  オブジェクトの非表示
flag = !flag;                             //  flagの true と false の切り替え
}

// -->
</SCRIPT>
コメント
ブラウザが IE の場合 myObj には document.all["MENU0"].style が代入されています。

event.x : ポインタの水平座標 (x座標 左からの位置) を取得
event.y : ポインタの垂直座標 (y座標 上からの位置) を取得