一个超好的鼠标右键JavaScript代码

  1. <html>
  2. <head>
  3. <title>ddd</title>
  4. <style>
  5. .DreamMenu {
  6.     position:absolute;
  7.     visibility:hidden;
  8.     z-index:100;
  9.     overflow:hidden;
  10.     width:150px;
  11.     background-color:buttonface;
  12.     border:dimgray 1px solid !important;
  13.     border:buttonhighlight menu menu buttonhighlight 2px outset;
  14.     padding:1px !important;
  15.     padding:1px 1px 1px 0px;
  16.     font-size:12px;
  17. }
  18. .DreamMenu ul {
  19.     margin:1px;
  20.     border-bottom:buttonhighlight 1px solid;
  21.     border-top:buttonshadow 1px solid;
  22. }
  23. .DreamMenu a {
  24.     display:block;
  25.     width:100%;
  26.     padding:1px 2px 2px 20px;
  27.     cursor:default;
  28.     text-decoration:none;
  29.     color:#000000;
  30. }
  31. .DreamMenu a:hover {
  32.     background:highlight; 
  33.     color:#ffffff;
  34. }
  35. </style>
  36. </head>
  37. <body menu='menu'>
  38. <!---这段js最好写进文件方便用,为了在51能运行就直接写进来了--->
  39. <script>
  40. /***
  41. DreamCore - JsLib/Menu
  42. Date     : Dec 03, 2006
  43. Copyright: DreamSoft Co.,Ltd.
  44. Mail     : Dream@Dreamsoft.Ca
  45. Author   : Egmax
  46. Browser : IE5.0&+,Firefox1.5&+,Netscape7.0&+
  47. Update:
  48. ***/
  49. if(!document.all) document.captureEvents(Event.MOUSEDOWN);
  50. var _Tmenu = 0;
  51. var _Amenu = 0;
  52. var _Type = 'A';
  53. document.onclick = _Hidden;
  54. function _Hidden()
  55. {
  56.     if(_Tmenu==0) return;
  57.     document.getElementById(_Tmenu).style.visibility='hidden';
  58.     _Tmenu=0;
  59. }
  60. document.oncontextmenu = function (e)
  61. {
  62.     _Hidden();
  63.     var _Obj = document.all ? event.srcElement : e.target;
  64.     if(_Type.indexOf(_Obj.tagName) == -1) return;
  65.     _Amenu = _Obj.getAttribute('menu');
  66.     if(_Amenu == nullreturn;
  67.     if(document.all) e = event;
  68.     _ShowMenu(_Amenu, e);
  69.     return false;
  70. }
  71. function _ShowMenu(Eid, event)
  72. {
  73.     var _Menu = document.getElementById(Eid);
  74.     var _Left = event.clientX + document.body.scrollLeft;
  75.     var _Top = event.clientY + document.body.scrollTop;
  76.     _Menu.style.left = _Left.toString() + 'px';
  77.     _Menu.style.top = _Top.toString() + 'px';
  78.     _Menu.style.visibility = 'visible';
  79.     _Tmenu = Eid;
  80. }
  81. /***
  82. 可以支持其他标签INPUT,IMG
  83. ***/
  84. </script>
  85. <script>_Type='INPUT,A,DIV,BODY,IMG';</script>
  86. <!-----设置一个菜单层---->
  87. <div id="menu" class='DreamMenu'>
  88. <a href='0'>您好</a>
  89. <a href='1'>我是主菜单</a>
  90. <a href='2'>在页面上单击</a>
  91. <a href='3'>就可以看到我</a>
  92. <ul></ul>
  93. <a href='4'>打印</a>
  94. </div>
  95. <!-----设置一个菜单层---->
  96. <div id="menu2" class='DreamMenu'>
  97. <a href='0'>哈哈</a>
  98. <a href='1'>我是个链接</a>
  99. <a href='2'>好开心啊</a>
  100. <a href='3'>查看</a>
  101. <ul></ul>
  102. <a href='4'>打印</a>
  103. </div>
  104. <!-----设置一个菜单层---->
  105. <div id="menu3" class='DreamMenu'>
  106. <a href='0'>哈哈</a>
  107. <a href='1'>我是图片</a>
  108. <a href='2'>虽然打不开</a>
  109. <a href='3'>查看</a>
  110. <ul></ul>
  111. <a href='4'>打印</a>
  112. </div>
  113. <table><tr><td height=100>
  114. <!-----设置一个菜单menu属性---->
  115. <a href='test.php' menu='menu2'>菜单1</a>
  116. <a href='test.php' menu='menu2'>菜单2</a>
  117. </td></tr></table>
  118. <div style='height:300;' menu='menu'></div>
  119. <img src='http://bbs.51js.com/images/default/logo.gif' menu='menu3'>
  120. </body>
  121. </html>

支持不同对象不同菜单,兼容IE、Firefox

 

使用时候注意:

1.表格的需要给td,div用,tr和table是用不上了

2.如果出现提示第76行错误,即    _Menu.style.left = _Left.toString() + 'px'; 这句话有错的话,说明拿到了一个空值,需要在第73行和第74行之间添加一句话进行判断,即  if(_Menu==null) return;

3.在火狐中可能提示第50行 captureEvents(Event.MOUSEDOWN); 这个方法过期,不影响使用,请高手完善一下。

4.在火狐中,载入之后,控制台可以看见一个错误(不影响使用),第14行的    border:buttonhighlight menu menu buttonhighlight 2px outset;  错误,请高手完善一下。

 

感谢原作者,帮了我一个大忙

 

修改一处严重错误:第66行     if(_Amenu == 'null'return; ,应为    if(_Amenu == nullreturn;

判断不应该是对字符串判断,应该是对空值的判断,所以引号不能要!否着IE浏览器下面会提示错误。上面的已经改过了,可以放心拷贝

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值