js 右键菜单，支持不同对象不同菜单(兼容IE、Firefox)- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > js 右键菜单，支持不同对象不同菜单(兼容IE、Firefox)

Javascript: 动态改变图片尺寸（一）; JavaScript＋PHP 应用一：网页制作中双下拉菜单的动态实现; JavaScript + PHP 应用二：网页设计中树形菜单的动态实现; 在Javascript中为String对象添加trim,ltrim,rtrim方法; 纯JavaScript时钟; 网页之定时器详解; 为网页添加活动的背景音乐; Javascript Game; 实用的检测分辨率的程序代码; 【推荐】一个非常漂亮的列表框; 绝对精彩：在网页里做类似window右键的弹出式菜单; 怎样使网页中的元素可编辑??; JavaScript和Java的区别; 怎样编写IE和NN6通用的闪烁(blank)效果; 关于如何动态地在同一页面实现两个 < select > 互传 (s1 <==> s2); ＣＯＯＫＩＥ欺骗; 连串英文自动换行的方法; JavaScript中的正则表达式(1); JavaScript中的正则表达式(2); JavaScript窗口功能指南之定制新窗口

No. « 1 2 3 4 › »

技术文章搜索

关键字

Javascript 中的 js 右键菜单，支持不同对象不同菜单(兼容IE、Firefox)

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-02-27 浏览: 228 ::

收藏到网摘: n/a

使用JavaScript库还是自己写代码？ javascript innerText和innerHtml应用

版本虽然很老也不符合标准了，不过代码是值得参考的，需要右键菜单的朋友可以参考下。里面的代码修改也比较简单。

<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'>
<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.ruanchen.com'>软晨学习网</a>
<a href='http://www.baidu.com'> 百度</a>
<a href='http://www.g.cn'>google</a>
<a href='http://tools.ruanchen.com'>站长工具</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>
<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='/upload/tech/20100227/20100227014206_76dc611d6ebaafc66cc0879c71b5db5c.gif' menu='menu3'>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

使用JavaScript库还是自己写代码？ javascript innerText和innerHtml应用

Javascript 中的 js 右键菜单，支持不同对象不同菜单(兼容IE、Firefox)

评论 (0) All