| 现在就可以点击右键看看效果～希望你能喜欢^_^
使用JavaScript和CSS制作Office XP风格的网页右键菜单
以下为程序内容
<SCRIPT LANGUAGE=JavaScript>
//用于模仿Office XP的风格
function MouseOver(src,BackColor)
{ if (!src.contains(event.fromElement))
{ src.bgColor = BackColor;
src.style.bordercolor = "#000000";
}
}
function MouseOut(src, BackColor)
{ if (!src.contains(event.toElement))
{ src.bgColor = BackColor;
src.style.bordercolor = "#000000";
}
}
function BcMouseOver(src)
{ if (!src.contains(event.fromElement))
{ src.border = 1;
src.style.bgColor = "#B6BDD2"
}
}
function BcMouseOut(src)
{ if (!src.contains(event.toElement))
{ src.border = 0;
src.style.bgColor = "#f1f1f1"
}
}
//弹出消息
function MM_goToURL()
{ var i, args=MM_goToURL.arguments;
document.MM_returnValue = false;
for (i=0; i<(args.length-1); i+=2)
eval(args[i]+".location='"+args[i+1]+"'");
}
function MM_popupMsg(msg)
{ alert(msg);
}
</SCRIPT>
<DIV id=ie5menu style="backgroundColor=white">
<table width="150" border="0" bgcolor="#f1f1f1"
bordercolor="#000000" cellpadding="0"
cellspacing="0">
<tr bordercolor="#f1f1f1">
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0" align="center" onMouseOut="BcMouseOut(this);"
onMouseOver="BcMouseOver(this);" bordercolor="#000000"
bgcolor="#f1f1f1" bordercolorlight="#000000"
bordercolordark="#000000">
<tr bgcolor="#f1f1f1" bordercolor="#B6BDD2"
onMouseOut="MouseOut(this,'#f1f1f1');"
onMouseOver="MouseOver(this,'#B6BDD2');"
onClick="history.go(-1)">
<td width="26"><img border="0"
src="back.gif" width="24"></td>
<td class=flyoutLink>后退</td>
</tr>
</table>
</td>
</tr>
<tr bordercolor="#f1f1f1">
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0" align="center" onMouseOut="BcMouseOut(this);"
onMouseOver="BcMouseOver(this);" bordercolor="#000000"
bgcolor="#f1f1f1" bordercolorlight="#000000"
bordercolordark="#000000">
<tr bgcolor="#f1f1f1" bordercolor="#B6BDD2"
onMouseOut="MouseOut(this,'#f1f1f1');"
onMouseOver="MouseOver(this,'#B6BDD2');"
onClick="history.go(1)">
<td width="26"><img border="0"
src="forward.gif"
width="24"></td>
<td class=flyoutLink>前进</td>
</tr>
</table>
</td>
</tr>
<tr bordercolor="#f1f1f1">
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0" align="center" onMouseOut="BcMouseOut(this);"
onMouseOver="BcMouseOver(this);" bordercolor="#000000"
bgcolor="#f1f1f1" bordercolorlight="#000000"
bordercolordark="#000000">
<tr bgcolor="#f1f1f1" bordercolor="#B6BDD2"
onMouseOut="MouseOut(this,'#f1f1f1');"
onMouseOver="MouseOver(this,'#B6BDD2');"
onClick="location.reload()">
<td width="26"><img border="0"
src="refurbish.gif"
width="24"></td>
<td class=flyoutLink>刷新</td>
</tr>
</table>
</td>
</tr>
<tr bordercolor="#f1f1f1">
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0" align="center"
onMouseOut="BcMouseOut(this);"
onMouseOver="BcMouseOver(this);"
bordercolor="#000000"
bgcolor="#f1f1f1" bordercolorlight="#000000"
bordercolordark="#000000">
<tr bgcolor="#f1f1f1" bordercolor="#B6BDD2"
onMouseOut="MouseOut(this,'#f1f1f1');"
onMouseOver="MouseOver(this,'#B6BDD2');"
onClick="window.close()">
<td width="26"><img border="0"
src="close.gif"
width="24"></td>
<td class=flyoutLink>关闭窗口</td>
</tr>
</table>
</td>
</tr>
<tr bordercolor="#f1f1f1">
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0"
align="center" onMouseOut="BcMouseOut(this);"
onMouseOver="BcMouseOver(this);" bordercolor="#000000"
bgcolor="#f1f1f1" bordercolorlight="#000000"
bordercolordark="#000000">
<tr bgcolor="#f1f1f1" bordercolor="#B6BDD2"
onMouseOut="MouseOut(this,'#f1f1f1');"
onMouseOver="MouseOver(this,'#B6BDD2');"
onClick="MM_popupMsg('欢迎来常回〓缘聚铁院〓看看\r欢迎给我来信,
共同学习进步\rtxj3000@263.net')">
<td width="26"><img border="0"
src="about.gif" width="24"></td>
<td class=flyoutLink>关于本菜单</td>
</tr>
</table>
</td>
</tr>
</table>
</DIV>
<SCRIPT type=text/JavaScript language="">
//检测浏览器
ie = (document.all)? true:false
if (ie){
function ctlent(eventobject){if(event.ctrlKey &&
window.event.keyCode==13){this.document.FORM.submit();}}
}
clckcnt = 0;
var nn = !!document.layers;
var ie = !!document.all;
if (nn) {
netscape.security.PrivilegeManager.enablePrivilege(
"UniversalSystemClipboardAccess");
var fr=new java.awt.Frame();
var Zwischenablage = fr.getToolkit().getSystemClipboard();
}
var menuskin=0
var display_url=0
//显示右键菜单
function showmenuie5(){
var rightedge=document.body.clientWidth-event.clientX
var bottomedge=document.body.clientHeight-event.clientY
//菜单定位
if (rightedge<ie5menu.offsetWidth)
ie5menu.style.left=document.body.scrollLeft+event.
clientX-ie5menu.offsetWidth
else
ie5menu.style.left=document.body.scrollLeft+event.clientX
if (bottomedge<ie5menu.offsetHeight)
ie5menu.style.top=document.body.scrollTop+event.
clientY-ie5menu.offsetHeight
else
ie5menu.style.top=document.body.scrollTop+event.clientY
ie5menu.style.visibility="visible"
return false
}
//右键菜单隐藏
function hidemenuie5()
{ ie5menu.style.visibility="hidden"
}
if (document.all&&window.print)
{ if (menuskin==0)
ie5menu.className="skin0"
else
ie5menu.className="skin1"
document.oncontextmenu=showmenuie5
document.body.onclick=hidemenuie5
}
</SCRIPT>
欢迎使用本菜单，欢迎大家给我来信。
作者：未知 来源：Internet |
