您的位置：首页 > 其它

转一个右键菜单，支持不同对象不同菜单，兼容IE、Firefox

2008-11-06 21:10 597 查看

<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 : [email]Dream@Dreamsoft.Ca[/email]

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='0'>您好</a>

<a href='1'>我是主菜单</a>

<a href='2'>在页面上单击</a>

<a href='3'>就可以看到我</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='http://bbs.51js.com/images/default/logo.gif' menu='menu3'>

在图片、链接、和窗口点右键看效果，可以定义其他元素，只要设定好菜单，也可以每个元素一个菜单

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航