右クリックでおしゃれにメニュー 改訂版
以前の
はIE専用でしたがNetScape6で有効にしました NN4では無効
同ページ上にリンク先を開く例と 別ブラウザに開く例とが入ってます
ako's cyberpage
JS新作
JS一覧
JS関連メニュー
FAQ
GuestBook
Shopping
WindowsIE4.ｘ以降では
Ｃｏｐｙボタン
を押すと 以下のスクリプトがコピーされます
WindowsのNetScape & Macでは反転のみですので Ctrl+Cキーでコピーして下さい
コピーした物の中に書かれているコメントに従って 御自分のHTMLに お入れ下さい
<head> <!--■以下スタイルシートをhead内に入れてください--> <style type="text/css"> <!-- /*http://myako.net/ ako's cyberpage*/ .akom{ position:absolute;visibility:hidden; cursor:crosshair;color:#009999;font-size:13px; /*■#009999は最初に出るメニューの文字色*/ font-family:"Osaka","Tahoma"; border:1px solid blue;background-color:#dddeff; /*■solid blueのblueはメニューの枠の色 #dddeffはメニューのバック色*/ z-index:100;width:130px;}/*■130pxはメニューの幅*/ .akom2{ line-height:25px;} /*■line-height:25pxはメニューとメニューの行間スペース*/ --> </style> <!--■以下はNN4.x用の右クリック禁止スクリプト 要らなければ消す--> <SCRIPT language=JavaScript> <!-- function akoNNnonr(akko) {if (document.layers) { if (akko.which==2||akko.which==3) {return false;}}} if (document.layers) {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=akoNNnonr;} else{document.onmouseup=akoNNnonr;} // --> </SCRIPT> <!--■ここまでNN4.x用の右クリック禁止スクリプト 要らなければ消す--> </head> <!--■ここまでhead内に入れる--> <body bgcolor="#edffef" text="#aa11ff" link="#cc0000" vlink="#009999"> <!--■body内に以下の例に従ってメニューを並べる いくつでも可--> <!--■target="newwin"となっているところは新しいwindowが開きます--> <center> <a href="http://myako.net/java/migi/migimenu.html" target="_blank">以前の</a>はIE専用でしたがNetScape6で有効にしました NN4では無効<br><br> 同ページ上にリンク先を開く例と 別ブラウザに開く例とが入ってます<br> <div id="akom1" class="akom" onMouseover="hl(event)" onMouseout="ll(event)" onClick="tobu(event)" gamen:none> <div class="akom2" url="http://myako.net/">ako's cyberpage</div> <div class="akom2" url="http://myako.net/java2/news.html" target="newwin">JS新作</div> <div class="akom2" url="http://myako.net/java/javanewn.cgi" target="newwin">JS一覧</div> <div class="akom2" url="http://myako.net/java/fr2.html" target="newwin">JS関連メニュー</div> <div class="akom2" url="http://myako.net/java/jsfaq.cgi" target="newwin">FAQ</div> <div class="akom2" url="http://myako.net/ufu/jsguest.cgi" target="newwin">GuestBook</div> <div class="akom2" url="http://myako.net/shop1.html">Shopping</div> </div> <!--■続けてbody内に以下スクリプトを入れて下さい--> <script language="JavaScript"> <!-- /*http://myako.net/ ako's cyberpage*/ var url=0 var IE=document.all&&document.getElementById var N6=document.getElementById&&!document.all if (IE||N6) var menuO=document.getElementById("akom1") function miruIE(ako){ var Mmigi=IE? document.body.clientWidth-event.clientX : window.innerWidth-ako.clientX var Mhidari=IE? document.body.clientHeight-event.clientY : window.innerHeight-ako.clientY if (Mmigi<menuO.offsetWidth) menuO.style.left=IE? document.body.scrollLeft+event.clientX-menuO.offsetWidth : window.pageXOffset+ako.clientX-menuO.offsetWidth else menuO.style.left=IE? document.body.scrollLeft+event.clientX : window.pageXOffset+ako.clientX if (Mhidari<menuO.offsetHeight) menuO.style.top=IE? document.body.scrollTop+event.clientY-menuO.offsetHeight : window.pageYOffset+ako.clientY-menuO.offsetHeight else menuO.style.top=IE? document.body.scrollTop+event.clientY : window.pageYOffset+ako.clientY menuO.style.visibility="visible" return false } function goM(ako){ menuO.style.visibility="hidden" } function hl(ako){ var utuO=IE? event.srcElement : ako.target if (utuO.className=="akom2"||N6&&utuO.parentNode.className=="akom2"){ if (N6&&utuO.parentNode.className=="akom2") utuO=utuO.parentNode utuO.style.backgroundColor="highlight" utuO.style.color="red" }}//■redはオンマウスのときのメニューの文字色 function ll(ako){ var utuO=IE? event.srcElement : ako.target if (utuO.className=="akom2"||N6&&utuO.parentNode.className=="akom2"){ if (N6&&utuO.parentNode.className=="akom2") utuO=utuO.parentNode utuO.style.backgroundColor="" utuO.style.color="#000080"//■#000080はオンマウス後のメニューの文字色 window.status='' }} function tobu(ako){ var utuO=IE? event.srcElement : ako.target if (utuO.className=="akom2"||N6&&utuO.parentNode.className=="akom2"){ if (N6&&utuO.parentNode.className=="akom2") utuO=utuO.parentNode if (utuO.getAttribute("target")) window.open(utuO.getAttribute("url"),utuO.getAttribute("target")) else window.location=utuO.getAttribute("url") }} if (IE||N6){ menuO.style.gamen='' document.oncontextmenu=miruIE document.onclick=goM } //--> </script> </center> <!--■ここまでbody内に入れて下さい--> <br><br><br> ソースを開いて■から書かれてるコメントに従って書き換えて下さい<br><br> Script使用の際は以下リンクをお入れください<br> <a href="http://myako.net/" target="_top"> Script by ako's cyberpage</a>
Script by ako's cyberpage