支持所有浏览器的右键菜单
<style type="text/css">
#container {
background:#b36637;
text-align : center;
width : 500px;
height : 500px;
border : 1px solid blue;
margin : 0 auto;
}
.skin {
background:#ffff64;
width : 180px;
border : 1px solid gray;
padding : 2px;
visibility : hidden;
position : absolute;
}
div.menuitems {
margin : 2px 0;
}
div.menuitems a {
color : #000000;
text-decoration : none;
}
div.menuitems:hover {
border:1px solid gray;
width:160px;
background-color : #ffffff;
}
</style>
<script>
window.onload = function() {
var container = document.getElementById('container');
var menu = document.getElementById('menu');
/*显示菜单*/
function showMenu() {
var evt = window.event || arguments[0];
/*获取当前鼠标右键按下后的位置，据此定义菜单显示的位置*/
var rightedge = container.clientWidth+evt.clientX;
var bottomedge = container.clientHeight+evt.clientY;
/*如果从鼠标位置到容器右边的空间小于菜单的宽度，就定位菜单的左坐标（Left）为当前鼠标位置向左一个菜单宽度*/
if (rightedge < menu.offsetWidth)
menu.style.left = container.scrollLeft + evt.clientX - menu.offsetWidth + "px";
else
/*否则，就定位菜单的左坐标为当前鼠标位置*/
menu.style.left = container.scrollLeft + evt.clientX + "px";
/*如果从鼠标位置到容器下边的空间小于菜单的高度，就定位菜单的上坐标（Top）为当前鼠标位置向上一个菜单高度*/
if (bottomedge < menu.offsetHeight)
menu.style.top = container.scrollTop + evt.clientY - menu.offsetHeight + "px";
else
/*否则，就定位菜单的上坐标为当前鼠标位置*/
menu.style.top = container.scrollTop + evt.clientY + "px";
/*设置菜单可见*/
menu.style.visibility = "visible";
LTEvent.addListener(menu,"contextmenu",LTEvent.cancelBubble);
}
/*隐藏菜单*/
function hideMenu() {
menu.style.visibility = 'hidden';
}
LTEvent.addListener(container,"contextmenu",LTEvent.cancelBubble);
LTEvent.addListener(container,"contextmenu",showMenu);
LTEvent.addListener(document,"click",hideMenu);
}
</script>
</head>
<body>
<div id="menu" target="_blank">地图api</a>
</div>
<div target="_blank">实时交通</a>
</div>
<div target="_blank">地图搜索</a>
</div>
<div target="_blank">驾驶导航</a>
</div>
<hr>
<div target="_blank">灵图UU</a>
</div>
<div target="_blank">路书下载</a>
</div>
<hr>
<div target="_blank">关于本站</a>
</div>
<div target="_bland">友情链接</a>
</div>
</div>
<div id="container">
<p>右键此区域</p>
</div>
</body>
</html>?