一个右键菜单代码

<html>

<head>

<title>XP右键菜单</title>

//---------这段代码可以放在一个js文件里方便导入-------------

// 菜单初试化

var MenuItem=""

var strMenu

var sp=true //使用特效设置，false表示不是用特效

var ts=6

//添加菜单项目

function addmenu(type,caption,url,target,icon)

{

if (!icon)

iconpath="attachments/month_0406/vsjz_blank.gif";//默认图标路径

else

iconpath=icon

switch(type)

{

case 0:

if (!target)

{

MenuItem+="<tr height=24><td><td class=loseitems onClick=\"javascript:location.href='"+url+"'\" background="+iconpath+">"+caption+"<td>"

}

else

{

if (target=='_blank')

{

MenuItem+="<tr height=24><td><td class=loseitems onClick=\"javascript:window.open('"+url+"')\" background="+iconpath+">"+caption+"<td>"

}

else

{

MenuItem+="<tr height=24><td><td class=loseitems onClick=\"javascript:"+target+".location.href='"+url+"'\" background="+iconpath+">"+caption+"<td>"

}

break;

case 1:

MenuItem+="<tr height=24><td><td class=loseitems onClick=\"javascript:"+url+"\" background="+iconpath+">"+caption+"<td>"

break;

case 2:

MenuItem+="<tr><td><td align=right colspan=2><hr>"

break;

}

//建立菜单

function buildmenu(){

strMenu = "<div id=\"menu\" class=\"clsMenu\">"

strMenu +="<table border=0 cellspacing=0 width=100% cellpadding=0 onMouseover=\"highlight()\" onMouseout=\"lowlight()\"><tr height=1><td width=1><td><td width=1>"

strMenu +=MenuItem

strMenu += "<tr height=1><td><td><td></table>"

strMenu += "</div>"

if (isie()) document.write (strMenu);

document.oncontextmenu= showmenu

document.body.onclick= hidemenu

}

// 判断客户端浏览器

function isie() {

if (navigator.appName=="Microsoft Internet Explorer") {

return true;

} else {

return false;

}}

// 显示菜单

function showmenu(){

if (isie()){

var redge=document.body.clientWidth-event.clientX

var bedge=document.body.clientHeight-event.clientY

if (redge<menu.offsetWidth)

menu.style.left=document.body.scrollLeft+event.clientX-menu.offsetWidth

else

menu.style.left=document.body.scrollLeft+event.clientX

if (bedge<menu.offsetHeight)

menu.style.top=document.body.scrollTop+event.clientY-menu.offsetHeight

else

menu.style.top=document.body.scrollTop+event.clientY

menu.style.visibility="visible"

}

return false

}

// 隐藏菜单

function hidemenu(){

if (isie()) menu.style.visibility="hidden"

}

// 菜单项获得焦点时加亮显示

function highlight(){

if (event.srcElement.className=="loseitems"){

　if (sp) {event.srcElement.style.filter="revealTrans(duration=.1)" ;event.srcElement.filters[0].transition=ts}

if (sp) event.srcElement.filters[0].apply();

event.srcElement.className="menuitems"

if (sp) event.srcElement.filters[0].play();

}

// 菜单项失去焦点

function lowlight(){

if (event.srcElement.className=="menuitems"){

if (sp) event.srcElement.style.filter="blendtrans(duration=.15)" ;

if (sp) event.srcElement.filters[0].apply();

event.srcElement.className="loseitems"

if (sp) event.srcElement.filters[0].play();

}}

//--------------js代码结束-------------

</script>

//------------插入菜单项目演示---------

//addmenu(type,caption,url,target,icon)

//type=0 超连接 type=1 执行javascript语句 type=2 分割线

//caption 显示文字

//url 地址或javascript语句

//target 目标

//icon 图标

addmenu(1,"关于我","alert('我是舜子英文名PuterJam')","","attachments/month_0406/jg_n_help.gif")

addmenu(0,"我的Blog","http://www.sunsinwa.com/puterjam/","_blank")

addmenu(1,"添加到收藏夹","window.external.AddFavorite('http://www.sunsinwa.com/puterjam/', 'PuterJam Blog')")

addmenu(0,"联系我","mailto:puterjam@etang.com","_blank")

addmenu(2)

addmenu(0,"蓝色理想","http://www.blueidea.com/","_blank")

addmenu(0,"经典论坛","http://www.blueidea.com/bbs","_blank")

addmenu(2)

addmenu(1,"动画效果:<span id=kg>ON<span>","sp=!sp;if (sp) {kg.innerText='ON'} else {kg.innerText='OFF'}")

addmenu(1,"上一个效果","ts--;if (ts<1) ts=23")

addmenu(1,"下一个效果","ts++;if (ts>23) ts=1")

buildmenu()

</script>

<style>

.clsMenu

{

cursor: default;

color: #000000;

position: absolute;

width: 150px;

background-color: #D4D0C8;

border: 1px solid #000000;

visibility: hidden;

filter:progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#cccccc,strength=3); background-image:url('attachments/month_0406/84v__back.gif')

}

.menuitems

{

font-size: 12px;

color: #000000;

padding-left: 30px;

padding-right: 19px;

padding-top:2px;

padding-bottom:0px;

line-height: 18px;

background-color:#B6BDD2;

border:1px solid #0A246A;

color:#000000;

background-repeat:no-repeat;

}

.loseitems

{

font-size: 12px;

color: #000000;

padding-left: 29px;

padding-right: 10px;

padding-top:1px;

padding-bottom:1px;

line-height: 18px;

color:#000000;

background-repeat:no-repeat;

}

{

width:80%;

height:1px;

}

</style>

</head>

<body>

</body>

</html>