マウスボタン・ダウンでリンク先をリスト表示する | |||||
Sample 下の Menu_List と書いている所をクリックして下さい。 | |||||
|
|||||
ソース | |||||
<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- var win_param = "height=500,width=500,location=no,scrollbars=no," + "menubars=no,toolbars=no,resizable=yes"; var vis_mnu = ""; var act_mnu, url; function menu_handle(act_mnu,url) { popup = window.open("http://"+url,"MenuPopup",win_param); hideMenu(act_mnu); popup.focus() } function list_menu(act_mnu) { if (vis_mnu == "") showMenu(act_mnu); else { if (vis_mnu == act_mnu) hideMenu(act_mnu); else { hideMenu(vis_mnu); showMenu(act_mnu); } } } function showMenu(act_mnu) { act_mnu.style.background = "darkcyan"; act_mnu.style.visibility = "visible"; vis_mnu = act_mnu; } function hideMenu(act_mnu) { act_mnu.style.background = ""; act_mnu.style.visibility = "hidden"; vis_mnu = ""; } //--> </script> </HEAD> <BODY TEXT="black" LINK=blue VLINK=white ALINK=red> <table border=0 cellpadding=2> <tr bgcolor=darkcyan style="cursor:default"> <td align=center onMousedown="list_menu(document.all.Mnu1)"><font color=yellow> <b> Menu_List <font size=1>(ココをクリック) </td> </tr> <tr> <td valign="top"> <table id=Mnu1 width=100% style="cursor:default; visibility:hidden;"> <tr><td onClick="menu_handle(Mnu1,'www.yahoo.co.jp/')"> <a href="#">yahoo.co.jp</a> </td></tr> <tr><td onClick="menu_handle(Mnu1,'www.excite.co.jp/')"> <a href="#">excite.co.jp </a> </td></tr> <tr><td onClick="menu_handle(Mnu1,'www.google.com/')"> <a href="#">google.com </a> </td></tr> </table> </td> </tr> </table> </BODY> </HTML> |
|||||
ワンポイント解説 | |||||
win_param = "height=500,width=500,・・・・ で、ウィンドウをオープンする時のパラメーターを設定しています。
function showMenu(act_mnu) で、メニューが開いたときの背景色などを設定しています。 function hideMenu(act_mnu) で、メニューが閉じたときの背景色などを設定しています。 |