在一般的網(wǎng)頁(yè)中，IE瀏覽器的默認右鍵菜單是一成不變的固定模式，大部分網(wǎng)友瀏覽網(wǎng)頁(yè)時(shí)
對它的利用率不高。對專(zhuān)業(yè)的網(wǎng)頁(yè)設計師來(lái)說(shuō)，如果能將右鍵菜單設計成個(gè)性化的內容，樣式該
是多么的酷和方便?！ ?
試想一下，用戶(hù)在你的網(wǎng)站上一點(diǎn)右鍵，就是你精心組織的“鏈接”、“發(fā)信”，甚至包含
了繽紛的交互式Flash動(dòng)畫(huà)！如圖1——別流口水了，下面咱們就解解饞，看看如何制作吧：)。
右鍵菜單的改造，我有兩種途徑(其實(shí)，本質(zhì)是一樣的，都是JavaScript的東西)。
第一種方法是較早的，把下列源代碼復制到網(wǎng)頁(yè)中HTML文件的中即可。
< style> < !-- .skin0 { position:absolute; text-align:left; width:200px; border:2px solid black; background-color:menu; font-family:Verdana; line-height:20px; cursor:default; visibility:hidden; } .skin1 { cursor:default; font:menutext; position:absolute; text-align:left; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; width:120px; background-color:menu; border:1 solid buttonface; visibility:hidden; border:2 outset buttonhighlight; } .menuitems { padding-left:15px; padding-right:10px; } --> < /style> < SCRIPT LANGUAGE="JavaScript1.2"> < !-- Web Site: http://www.painting-effects.co.uk --> < !-- This script and many more are available free online at --> < !-- The JavaScript Source!! http://javascript.internet.com --> < !-- Begin var menuskin = "skin1"; // skin0, or skin1 var display_url = 0; // Show URLs in status bar? function showmenuie5() { var rightedge = document.body.clientWidth-event.clientX; var bottomedge = document.body.clientHeight-event.clientY; if (rightedge < ie5menu.offsetWidth) ie5menu.style.left = document.body.scrollLeft + event.clientX - ie5menu.offsetWidth; else ie5menu.style.left = document.body.scrollLeft + event.clientX; if (bottomedge < ie5menu.offsetHeight) ie5menu.style.top = document.body.scrollTop + event.clientY - ie5menu.offsetHeight; else ie5menu.style.top = document.body.scrollTop + event.clientY; ie5menu.style.visibility = "visible"; return false; } function hidemenuie5() { ie5menu.style.visibility = "hidden"; } function highlightie5() { if (event.srcElement.className == "menuitems") { event.srcElement.style.backgroundColor = "highlight"; event.srcElement.style.color = "white"; if (display_url) window.status = event.srcElement.url; } } function lowlightie5() { if (event.srcElement.className == "menuitems") { event.srcElement.style.backgroundColor = ""; event.srcElement.style.color = "black"; window.status = ""; } } function jumptoie5() { if (event.srcElement.className == "menuitems") { if (event.srcElement.getAttribute("target") != null) window.open(event.srcElement.url, event.srcElement.getAttribute("target")); else window.location = event.srcElement.url; } } // End --> < /script> < div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5();"> < div class="menuitems" url="javascript:history.back();">返回< /div> < div class="menuitems" url="http://javacool.3322.net">回首頁(yè)< /div> < hr> < div class="menuitems" url="http://www.163.com">網(wǎng)易< /div> < div class="menuitems" url="http://www.sohu.com">搜狐< /div> < hr> < div class="menuitems" url="http://www.sina.com.cn">新浪< /div> < div class="menuitems" url="http://www.yahoo.com.cn">雅虎< /div> < /div> < script language="JavaScript1.2"> if (document.all && window.print) { ie5menu.className = menuskin; document.oncontextmenu = showmenuie5; document.body.onclick = hidemenuie5; } < /script>
其效果如下圖:
第二種方法是利用Dreamweaver的一個(gè)插件——Right_Click_Menu_Buil-der,可以在http://www.macromedia.com下載得到。安裝后，可在Dreamweaver的“Command”菜單的下面找
到“Right Click Menu Builder”命令。
點(diǎn)擊該命令，便出現了一個(gè)如圖3所示的設置框。主要有兩部分內容：“Menu”和“Styles”。
Menu是設置功能的，超級鏈接、發(fā)信鏈接都在這里設置，在這里最多可以設10項連接。
此選擇框中“Menu Text”是你右鍵中將顯示的文字(換成中文吧)；在“URL”中寫(xiě)入相應的
鏈接路徑；“Target”決定是否是新窗口或是用現在的窗口展示鏈接的內容，填入“Blank”就是在
新窗口顯示，和Dreamweaver的“Target”設置是一樣的。
Styles是負責設置菜單外形的，有兩種選擇:
img src="http://tech.china.com/zh_cn/netschool/homepage/167718/20020521/images/
11257823_63732.jpg">
“Windows Type Menu(Default)” 是默認項——最樸實(shí)的樣子，熟悉的Windows風(fēng)格；
“Custom Menu” 自定意菜單，如果你選擇了這一項，還要對下面的內容進(jìn)行設置：
“Menu Width”，菜單的寬度；
“Font”，字體；
“Font Color”，字體顏色；
“Font Side”，字體大??；
“Background Color”、“Background Image”，背景色及背景圖；
還有“Cursor”，是用來(lái)選擇鼠標樣式的。
以上的這些設定好了，就可以點(diǎn)“Add”生成效果了。預覽一下,不錯吧?
那怎樣加入Flash呢？是這樣做的：在網(wǎng)頁(yè)中加一個(gè)“Table”，它的“W”寬建議設為：“100%”，
這樣會(huì )方便你下面添加的各種元素的定位。好，在該“Table”中插入Flash的SWF文件，位置設
成“居中”(主要是方便定位，當然具體問(wèn)題具體分析，自己多嘗試一下會(huì )有心得的)。
小技巧：Flash動(dòng)畫(huà)不妨做成有交互鏈接的那種，為什么呢？這樣你就可以加任意數量的超級鏈接。
插件自身有最多10條的限制，用了Flash可就全解決啦!^_^
