HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> RightMenu</TITLE> <style> <!--- body { background-color:#3a6ea5; font-size:12px; } /* 右键菜单Start */ #rightmenu { position:absolute; z-index:15; background-color:#cccccc; border:1px solid #eee; width:150px; -moz-border-radius:3; height:160px; display:none; } #rightmenubg { position:absolute; z-index:14; width:150px; height:160px; background-color:#cccccc; -moz-opacity: 0.30; -moz-border-radius:3; filter: progid:dximagetransform.microsoft.blur(pixelradius=2,makeshadow="true",shadowopacity=0.4); display:none; } #rightmenu a { display:block; width:150px; height:20px; line-height:20px; text-decoration: none; color:#000000; } #rightmenu a:hover { color:#000000; background-color:#009; } /* 右键菜单End */ ---> </style> </HEAD> <BODY onclick="bodyclick(event)" oncontextmenu="return showcontextmenu(event)"> <script type="text/javascript"> var ie = (navigator.appVersion.indexOf("MSIE")!=-1);//IE var ff = (navigator.userAgent.indexOf("Firefox")!=-1);//Firefox document.write("<div id=\"rightmenu\"></div>"); document.write("<div id=\"rightmenubg\"></div>"); Array.prototype.c = Array.prototype.concat; function buffer() { var s = []; s = s.c(["<a href=\"\"> 项目一</a>"]); s = s.c(["<a href=\"\"> 项目二</a>"]); s = s.c(["<a href=\"\"> 项目三</a>"]); s = s.c(["<hr>"]); s = s.c(["<a href=\"\"> 项目五</a>"]); s = s.c(["<a href=\"\"> 项目六</a>"]); s = s.c(["<a href=\"\"> 项目七</a>"]); s = s.c(["<a href=\"\"> 项目作</a>"]); s = s.join(""); document.getElementById("rightmenu").innerHTML = s; } var rightmenu = document.getElementById("rightmenu"); var rightmenubg = document.getElementById("rightmenubg"); var body = document.body; var ex=0,ey=0; function showcontextmenu(evt) { ex = evt.clientX;ey = evt.clientY; rxy(); rightmenu.style.display = "block"; rightmenubg.style.display = "block"; evt.cancelBubble = true; return false; } function bodyclick(evt) { rightmenu.style.display = "none";//关闭右键菜单 rightmenubg.style.display = "none";//关闭右键菜单 } function rxy() { var step=3; if(ie){step=1} if(ff){step=6} if(ex+150>body.clientWidth) { rightmenu.style.left = ex - 150; rightmenubg.style.left = ex - 150 + step; } else { rightmenu.style.left = ex; rightmenubg.style.left = ex + step; } if(ey+200>body.clientHeight) { rightmenu.style.top = ey - 160; rightmenubg.style.top = ey - 160 + step; } else { rightmenu.style.top = ey; rightmenubg.style.top = ey + step; } } function showcontextmenu(evt) { ex = evt.clientX;ey = evt.clientY; rxy(); rightmenu.style.display = "block"; rightmenubg.style.display = "block"; evt.cancelBubble = true; return false; } window.onload = function() { buffer(); } </script> </BODY> </HTML>