页面中点击鼠标右键----弹出与windows界面相似的菜单
|
日期：2004年9月15日 作者：清风网络学院 查看:[大字体
中字体 小字体]
|
想在Web Form中做出与windows中相似的菜单，可是发帖问人又没人回，自己摸索郁闷了一天之后，终于在MSDN中找到了相似的方法，具体如下：
（下面的代码帖到记事本能直接运行查看）
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns:MSHelp=http://msdn.microsoft.com/msHelp>
<HEAD>
<TITLE>oncontextmenu Event Sample</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=iso-8859-1">
<META NAME="AUTHOR" CONTENT="InetSDK">
<META NAME="MS.LOCALE" CONTENT="EN-US">
<META NAME="ROBOTS" CONTENT="noindex">
<!--设置菜单的背景样式-->
<STYLE>
.menuItem {font-family:sans-serif;font-size:10pt;width:100;padding-left:20;
background-Color:menu;color:black}
.highlightItem {font-family:sans-serif;font-size:10pt;width:100;padding-left:20;
background-Color:highlight;color:white}
.clickableSpan {padding:4;width:500;background-Color:blue;color:white;border:5px gray solid}
</STYLE>
<SCRIPT>
//<!--
//弹出菜单：
function displayMenu() {
whichDiv=event.srcElement;
menu1.style.leftPos+=10;
menu1.style.posLeft=event.clientX;
menu1.style.posTop=event.clientY;
menu1.style.display="";
menu1.setCapture();
}
//高亮显示鼠标移上是菜单的背景
function switchMenu() {
el=event.srcElement;
if (el.className=="menuItem") {
el.className="highlightItem";
} else if (el.className=="highlightItem") {
el.className="menuItem";
}
}
//点击菜单相应项时触发相应的事件
function clickMenu() {
menu1.releaseCapture();
menu1.style.display="none"; //点击后隐藏菜单
el=event.srcElement;
if (el.id=="mnuRed") {
whichDiv.style.backgroundColor="red";
} else if (el.id=="mnuGreen") {
whichDiv.style.backgroundColor="green"; //选择Green时背景变为绿色
} else if (el.id=="mnuBlue") {
whichDiv.style.backgroundColor="blue"; //选择blue时背景变为蓝色
} else if (el.id=="mnuYellow") {
whichDiv.style.backgroundColor="yellow"; //选择yellow时背景变为黄色
}
}
//-->
</SCRIPT>
<!-- SAMPLE_STYLE_START -->
<LINK REL="stylesheet" HREF="/workshop/basicSDKIE4.css" TYPE="text/css">
<!-- SAMPLE_STYLE_END -->
<LINK REL="stylesheet" TYPE="text/css" HREF="ms-help://Hx/HxRuntime/HxLink.css"><STYLE TYPE="text/css">
PRE.clsCode { font-size:110%; }
PRE.clsSyntax { font-size:100%; }
TD DIV.clsBeta { display:none;}
MSHelp\:link {
color:#0000ff;
text-decoration:underline;
上一篇:把文章内容中涉及到的图片自动保存到本地服务器
下一篇:控制IE WebControl中TreeView的高度
|
| 页面中点击鼠标右键----弹出与windows界面相似的菜单 相关文章： |
|
|
|
| 页面中点击鼠标右键----弹出与windows界面相似的菜单 相关软件： |
|
|
|
精品推荐