<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>XP右键菜单</title>
<script>
//---------这段代码可以放在一个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>
<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;
}
hr
{}{
width:80%;
height:1px;
}
</style>
</head>
<body>
</body>
</html>
