富贵资源网 Design By www.hznty.com
js代码如下:
复制代码 代码如下:
<script type="text/javascript">
//禁用右键菜单
document.oncontextmenu=ContextMenu;
//鼠标右击事件
function ContextMenu()
{
//创建两个变量,作为菜单出现的坐标
var x;
var y;
//获取菜单外部Div(下面简称面板)
var FramePanel=document.getElementById("FrameDiv");
//获取面板宽度和高度
var PanelWidth=parseInt(FramePanel.style.width.replace("px",""));
var PanelHeight=parseInt(FramePanel.style.height.replace("px",""));
//获取鼠标坐标
var MouseX=event.clientX;
var MouseY=event.clientY;
//获取网页窗口宽度和高度
var WindowWidth=document.body.offsetWidth;
var WindowHeight=document.documentElement.offsetHeight;
//如果鼠标X坐标+面板宽度>网页窗口宽度,则面板左边显示
if((MouseX+PanelWidth)>=WindowWidth)
{
x=MouseX-PanelWidth-20;
}
else
{
x=MouseX;
}
//如果鼠标Y坐标+面板高度>网页窗口高度,则面板上边显示
if((MouseY+PanelHeight)>=WindowHeight)
{
y=MouseY-PanelHeight-20;
}
else
{
y=MouseY;
}
//显示面板
FramePanel.style.left=x;
FramePanel.style.top=y;
FramePanel.style.display="block";
//隐藏二级菜单
document.getElementById("ChildDiv").style.display="none";
return false;//这句代码即等于event.returnValue=false;
}
//鼠标选择该菜单,参数说明:arg为该菜单Div,imageUrl指要替换的image地址,hasChildMenu指该菜单是否有子菜单,childPanelId指子菜单ID(如果有子菜单的话)
function MenuOnMouseOver(arg,imageUrl,hasChildMenu,childPanelId)
{
//替换背景图片(图片路径为相对路径)
arg.style.backgroundImage="url('"+imageUrl+"')";
//改变div背景颜色
arg.style.backgroundColor="#1665CB";
//改变字体颜色
arg.style.color="#ffffff";
//如果该菜单下有子菜单
if(hasChildMenu)
{
//创建两个变量,作为菜单出现的坐标
var x;
var y;
//获取子菜单Div(下面简称子面板)
var ChildPanel=document.getElementById(childPanelId);
//debugger;
//获取子面板宽度和高度
var ChildPanelWidth=parseInt(ChildPanel.style.width.replace("px",""));
var ChildPanelHeight=parseInt(ChildPanel.style.width.replace("px",""));
//获取父亲菜单Div(下面简称父面板)
var FramePanel=event.srcElement;
//获取父面板宽度和高度
var PanelWidth=FramePanel.offsetWidth;
var PanelHeight=FramePanel.offsetHeight;
//获取鼠标坐标
var MouseX=event.clientX;
var MouseY=event.clientY;
//获取鼠标在父面板的偏移位置
var MouseOffsetWidth=event.offsetX;
var MouseOffsetHeight=event.offsetY;
//获取网页窗口宽度和高度
var WindowWidth=document.body.offsetWidth;
var WindowHeight=document.documentElement.offsetHeight;
//如果鼠标X坐标+面板宽度+子面板宽度>网页窗口宽度,则面板左边显示
if((MouseX-MouseOffsetWidth+PanelWidth+ChildPanelWidth)>=WindowWidth)
{
x=MouseX-MouseOffsetWidth-ChildPanelWidth-3;
}
else
{
x=MouseX-MouseOffsetWidth+PanelWidth-5;
}
//如果鼠标Y坐标+面板高度>网页窗口高度,则面板上边显示
if((MouseY-MouseOffsetHeight+ChildPanelHeight)>=WindowHeight-30)
{
y=MouseY-MouseOffsetHeight-ChildPanelHeight-15;
}
else
{
y=MouseY-MouseOffsetHeight+5;
}
//显示面板
ChildPanel.style.left=x;
ChildPanel.style.top=y;
ChildPanel.style.display="block";
}
}
//鼠标离开该菜单
function MenuOnMouseOut(arg,imageUrl,hasChildMenu,childPanelId)
{
if(hasChildMenu)
{
//子菜单div(以下简称子面板)
var ChildPanel=document.getElementById(childPanelId);
var ToElement=event.toElement;
//这里要注意,鼠标有可能移动到子面板的子孙div中,此时event.ToElement的DOM元素!=ChildPanel(子面板),event.ToElement.parentNode=ChildPanel,
if(ToElement==ChildPanel||ToElement.parentNode==ChildPanel)
{
ChildPanel.style.display="block";
}
else
{
ChildPanel.style.display="none";
}
}
//替换背景图片(图片路径为相对路径)
arg.style.backgroundImage="url('"+imageUrl+"')";
//改变div背景颜色
arg.style.backgroundColor="#ffffff";
//改变字体颜色
arg.style.color="#000000";
}
</script>

页面ASPX代码如下:
复制代码 代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ContextMenu.aspx.cs" Inherits="ContextMenu" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<link href="Css/StyleSheet.css" rel="Stylesheet" type="text/css"/>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<!--上下文菜单一级菜单-->
<div id="FrameDiv" runat="server" style="width:170px; height:300px; border-style:solid;border-width:1px; border-color:#A09F9F; background-color:White; display:none; position:relative; padding:1px 1px 1px 1px;">
<!--文件常用菜单-->
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/menu1_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/menu1.jpg')" style="background-image:url('Images/menu1.jpg')" onclick="OnCopyFolderMenuClcik()">
创建新文件夹
</div>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/menu2_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/menu2.jpg')" style="background-image:url('Images/menu2.jpg')">
搜索新文件夹
</div>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/menu3_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/menu3.jpg')" style="background-image:url('Images/menu3.jpg')">
删除该文件夹
</div>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/menu4_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/menu4.jpg')" style="background-image:url('Images/menu4.jpg')">
全部删除
</div>
<!--非常用菜单-->
<hr style="color:#A09F9F;width:160px; height:1px;"/>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/menu5_click.jpg','true','ChildDiv')" onmouseout="MenuOnMouseOut(this,'Images/menu5.jpg','true','ChildDiv')" style="background-image:url('Images/menu5.jpg')">
文件排序
</div>
</div>
<cc1:DropShadowExtender ID="DropShadowExtender1" runat="server" TargetControlID="FrameDiv" Width="2" TrackPosition="true" Opacity="0.3">
</cc1:DropShadowExtender>
<!--上下文菜单二级菜单-->
<div id="ChildDiv" runat="server" style="width:170px; height:200px; z-index:2; background-color:White;border-style:solid; border-width:1px; border-color:#A09F9F; display:none; position:absolute; padding:1px 1px 1px 1px;">
<!--文件常用菜单-->
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/child_menu1_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/child_menu1.jpg')" style="background-image:url('Images/child_menu1.jpg')">
名称
</div>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/child_menu2_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/child_menu2.jpg')" style="background-image:url('Images/child_menu2.jpg')">
创建时间
</div>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/child_menu3_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/child_menu3.jpg')" style="background-image:url('Images/child_menu3.jpg')">
类型
</div>
<div class="MenuDivDefault" onmouseover="MenuOnMouseOver(this,'Images/child_menu4_click.jpg')" onmouseout="MenuOnMouseOut(this,'Images/child_menu4.jpg')" style="background-image:url('Images/child_menu4.jpg')">
大小
</div>
</div>
<cc1:DropShadowExtender ID="DropShadowExtender2" runat="server" TargetControlID="ChildDiv" Width="2" TrackPosition="true" Opacity="0.3">
</cc1:DropShadowExtender>
</form>
</body>
</html>


注意这句:
<cc1:DropShadowExtender ID="DropShadowExtender2" runat="server" TargetControlID="ChildDiv" Width="2" TrackPosition="true" Opacity="0.3">
</cc1:DropShadowExtender>
这个控件是ASP.NET AJAX1.0中实现阴影效果的控件,因此要在aspx页面添加控件注册:
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
控件具体属性意义请查询百度。
富贵资源网 Design By www.hznty.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
富贵资源网 Design By www.hznty.com

《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。