<html>
<style type="text/css">
div.line {
position:absolute;
z-index:2;
width:2px;
height:2px;
font-size:1px;
background-color:#0000AA;
overflow:hidden;
}
.skin {
width : 100px;
background:#CCCCFF;
border : 1px solid gray;
padding : 2px;
visibility : hidden;
position : absolute;
}
div.menuitems {
margin : 1px 0;
}
div.menuitems a {
text-decoration : none;
}
div.menuitems:hover {
background-color : #c0c0c0;
}
</style>
<body>
<script src="jquery-1.4.2.js"></script>
<script src="node.js"></script>
<input type="button" value="增加节点" onclick="addNode();"></input>
<input type="button" value="画线" onclick="changeMode('drawRefrence');"></input>
<input type="button" value="拖动" onclick="changeMode('drag');"></input>
<input type="text" value="" id="info" size="100"></input>
<div id="container" style="width:2000px;height:1500px;border:1px solid #000000;margin-left:0px;margin-top:0px;position: absolute;"></div>
<div id="menu" class="skin">
<div class="menuitems">
<a href="javascript:history.back();">表管理</a>
</div>
<div class="menuitems">
<a href="javascript:history.back();">条件管理</a>
</div>
<hr>
<div class="menuitems">
<a href="http://api.51ditu.com/" target="_blank">删除表</a>
</div>
</div>
<script type="text/javascript">
var container = document.getElementById('container');
var menu = document.getElementById('menu');
function hideMenu() {
menu.style.visibility = 'hidden';
}
function showMenu(evt) {
/*获取当前鼠标右键按下后的位置,据此定义菜单显示的位置*/
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(document,"click",hideMenu);
}
function hideMenu() {
menu.style.visibility = 'hidden';
}
</script>
</body>
</html>
评论2
最新资源