<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			ul{
				width: 100px;
				height: 100px;
				background: coral;
				display: none;
				/*绝对定位*/
				position: absolute;
				left:100px;
				top:20px;
			}
		</style>
	</head>
	<body>
		<ul id="ul">
			<li>aaa</li>
			<li>bbb</li>
			
		</ul>
	</body>
</html>
<script type="text/javascript">
	//鼠标右键菜单
	document.oncontextmenu=function(e){
		var eventObj=e||event;
		//鼠标x坐标,鼠标Y坐标
		var clientX=eventObj.clientX;
		var clientY=eventObj.clientY;
		//
		document.getElementById("ul").style.top=(clientY-20)+"px";
		document.getElementById("ul").style.left=(clientX-10)+"px";
		
		//
		document.getElementById("ul").style.display="block";
		return false; //阻止默认行为
	}
	//单击空白的就隐藏
	document.onclick=function(){
		document.getElementById("ul").style.display="none";
	}
</script>