js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧

來源：懂視網責編：小采時間：2020-11-27 20:47:02

js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧

js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧:版本雖然很老也不符合標準了，不過代碼是值得參考的，需要右鍵菜單的朋友可以參考下。里面的代碼修改也比較簡單。<html> <head> <title>ddd</title> <style> .DreamMenu { position:absolut

推薦度：

點擊下載本文 文檔為doc格式

導讀js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧:版本雖然很老也不符合標準了，不過代碼是值得參考的，需要右鍵菜單的朋友可以參考下。里面的代碼修改也比較簡單。<html> <head> <title>ddd</title> <style> .DreamMenu { position:absolut

版本雖然很老也不符合標準了，不過代碼是值得參考的，需要右鍵菜單的朋友可以參考下。

里面的代碼修改也比較簡單。

<html> 
<head> 
<title>ddd</title> 
<style> 
.DreamMenu { 
position:absolute; 
visibility:hidden; 
z-index:100; 
overflow:hidden; 
width:150px; 
background-color:buttonface; 
border:dimgray 1px solid !important; 
border:buttonhighlight menu menu buttonhighlight 2px outset; 
padding:1px !important; 
padding:1px 1px 1px 0px; 
font-size:12px; 
} 
.DreamMenu ul { 
margin:1px; 
border-bottom:buttonhighlight 1px solid; 
border-top:buttonshadow 1px solid; 
} 
.DreamMenu a { 
display:block; 
width:100%; 
padding:1px 2px 2px 20px; 
cursor:default; 
text-decoration:none; 
color:#000000; 
} 
.DreamMenu a:hover { 
background:highlight; 
color:#ffffff; 
} 
</style> 
</head> 
<body menu='menu'> 
<!---這段js最好寫進文件方便用，為了在51能運行就直接寫進來了---> 
<script> 
/*** 
DreamCore - JsLib/Menu 
Date : Dec 03, 2006 
Copyright: DreamSoft Co.,Ltd. 
Mail : Dream@Dreamsoft.Ca 
Author : Egmax 
Browser : IE5.0&+,Firefox1.5&+,Netscape7.0&+ 
Update: 
***/ 
if(!document.all) document.captureEvents(Event.MOUSEDOWN); 
var _Tmenu = 0; 
var _Amenu = 0; 
var _Type = 'A'; 
document.onclick = _Hidden; 
function _Hidden() 
{ 
if(_Tmenu==0) return; 
document.getElementById(_Tmenu).style.visibility='hidden'; 
_Tmenu=0; 
} 
document.oncontextmenu = function (e) 
{ 
_Hidden(); 
var _Obj = document.all ? event.srcElement : e.target; 
if(_Type.indexOf(_Obj.tagName) == -1) return; 
_Amenu = _Obj.getAttribute('menu'); 
if(_Amenu == 'null') return; 
if(document.all) e = event; 
_ShowMenu(_Amenu, e); 
return false; 
} 
function _ShowMenu(Eid, event) 
{ 
var _Menu = document.getElementById(Eid); 
var _Left = event.clientX + document.body.scrollLeft; 
var _Top = event.clientY + document.body.scrollTop; 
_Menu.style.left = _Left.toString() + 'px'; 
_Menu.style.top = _Top.toString() + 'px'; 
_Menu.style.visibility = 'visible'; 
_Tmenu = Eid; 
} 
/*** 
可以支持其他標簽INPUT,IMG 
***/ 
</script> 
<script>_Type='INPUT,A,DIV,BODY,IMG';</script> 
<!-----設置一個菜單層----> 
<div id="menu" class='DreamMenu'> 
<a href='http://www.gxlcms.com'>腳本之家</a> 
<a href='http://www.baidu.com'> 百度</a> 
<a href='http://www.g.cn'>google</a> 
<a href='http://tools.jb51.net'>站長工具</a> 
<ul></ul> 
<a href='4'>打印</a> 
</div> 
<!-----設置一個菜單層----> 
<div id="menu2" class='DreamMenu'> 
<a href='0'>哈哈</a> 
<a href='1'>我是個鏈接</a> 
<a href='2'>好開心啊</a> 
<a href='3'>查看</a> 
<ul></ul> 
<a href='4'>打印</a> 
</div> 
<!-----設置一個菜單層----> 
<div id="menu3" class='DreamMenu'> 
<a href='0'>哈哈</a> 
<a href='1'>我是圖片</a> 
<a href='2'>雖然打不開</a> 
<a href='3'>查看</a> 
<ul></ul> 
<a href='4'>打印</a> 
</div> 
<table><tr><td height=100> 
<!-----設置一個菜單menu屬性----> 
<a href='test.php' menu='menu2'>菜單1</a> 
<a href='test.php' menu='menu2'>菜單2</a> 
</td></tr></table> 
<div style='height:300;' menu='menu'></div> 
<img src='http://www.gxlcms.com/images/logo.gif' menu='menu3'>

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧

推薦度：

點擊下載本文 文檔為doc格式

標簽：菜單 IE js

熱門焦點

js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧

js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧

js右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)_javascript技巧

最新推薦

猜你喜歡

熱門推薦