您的位置：首页 > 编程语言 > ASP

ASP.NET 简单鼠标右键效果contextmenutrip

2015-11-12 21:21 295 查看

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="_20151110_Web.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style>
#__contextmenu {
position: absolute;
display: none;
width: auto;
z-index: 100;
padding: 0px;
list-style: none;
margin: 0px;
padding: 0px;
border-radius: 2px;
border: 2px solid rgb(102, 102, 102);
background-color: white;
}

#__contextmenu li {
border: none;
white-space: nowrap;
margin: 1px;
}

#__contextmenu li a {
cursor: pointer;
cursor: hand;
height: 100%;
text-decoration: none;
display: block;
padding: 3px 10px 3px 10px;
}

#__contextmenu li:hover {
background-color: gainsboro;
}
</style>
<script>
document.addEventListener("contextmenu", function (event) {
event.preventDefault();
var ctxMenu = document.getElementById("__contextmenu");
ctxMenu.style.display = "block";
ctxMenu.style.left = (event.pageX) + "px";
ctxMenu.style.top = (event.pageY) + "px";
}, false);
document.addEventListener("click", function (event) {
var ctxMenu = document.getElementById("__contextmenu");
ctxMenu.style.display = "none";
ctxMenu.style.left = "";
ctxMenu.style.top = "";
}, false);
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<ul id="__contextmenu">
<li>
<asp:LinkButton ID="lbClearSession" runat="server">Refresh Session Cache</asp:LinkButton></li>
<li>
<asp:LinkButton ID="lbClearApplication" runat="server">Reload Master Data</asp:LinkButton></li>
</ul>
</form>
</body>
</html>

ASP.NET contextmenutrip demo
最终实现效果为：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航