动态弹出右键菜单

/*右键菜单样式*/
.rightMenu{cursor:default;font-size:9pt;color:#012F51;border-left:1 solid #D0DFE2;border-top:1 solid #D0DFE2;border-right:1 solid #528388;border-bottom:1 solid #528388;background-color:#9CBFC3;}
.rightMenuSep1{width:100%;height:0;font-size:0px;border-bottom:1 solid #528388;}
.rightMenuSep2{width:100%;height:0;font-size:0px;border-top:1 solid #D0DFE2}
.rightMenuItem{width:100%;padding:1;cursor:default;temp:expression(οnmοuseοver=function(){this.style.backgroundColor="#BAD2D6";},οnmοuseοut=function(){this.style.backgroundColor="";})}


//任务栏按钮右键菜单
function desk_rightClick()
{
 try{
  if(event.button==2)
  {
   //获得与按钮对应的窗口
   tempRect=document.getElementById(event.srcElement.id.substr(0,event.srcElement.id.length-2));
   //动态创建右键菜单
   divElem=document.createElement("div");
   divElem.className="rightMenu";
   divElem.style.position="absolute";
   divElem.style.zIndex=1000002;
   divElem.style.width=80;
   divElem.frmName=event.srcElement.id.substr(0,event.srcElement.id.length-2);
   divElem.style.paddingTop=3;
   
   //添加菜单项
   var tempStr="";
   tempStr=tempStr+"<span flag=0 class=rightMenuItem>&nbsp;菜单项一</span><br>";
   tempStr=tempStr+"<span flag=1 class=rightMenuItem>&nbsp;菜单项二</span><br>";
   //分隔线
   tempStr=tempStr+"<span class=rightMenuSep1></span><br><span class=rightMenuSep2></span><br>"
   tempStr=tempStr+"<span flag=2 class=rightMenuItem>&nbsp;菜单项三</span><br>"; 
   divElem.innerHTML=tempStr;

   document.body.appendChild(divElem);
   divElem.style.display="block"; 
   //计算右键菜单的坐标
   if(parseInt(event.clientX)+85>parseInt(document.body.clientWidth))
    divElem.style.left=parseInt(event.clientX)-80;
   else
    divElem.style.left=parseInt(event.clientX);
   if(parseInt(event.clientY)+parseInt(divElem.offsetHeight)+5>parseInt(document.body.clientHeight)-25)
    divElem.style.top=parseInt(event.clientY)-parseInt(divElem.offsetHeight);
   else
    divElem.style.top=parseInt(event.clientY);
   
   //注意:onblur事件比onmousedown事件触发的晚,所以在点击菜单项的事件右onmousedown来代替onclick
   //当菜单项被点击后就触发整个菜单的onblur事件把菜单清除
   divElem.attachEvent("onblur",remove_deskRightDiv);
   divElem.attachEvent("onmousedown",deskRightOption_click);
   divElem.focus();
   
   
  }
 }catch(e){
  //alert(e.description);
 }
}
//清除右键菜单
function remove_deskRightDiv()
{
 try{
  tempElem=event.srcElement;
  tempElem.removeNode(true);
 }catch(e){
  //alert(e.description);
 }
}
//右键菜单项点击事件
function deskRightOption_click()
{
 try{
  var tempElem,tempRect;
  tempElem=event.srcElement;
  if(tempElem.tagName.toLowerCase()=="span")
  {
   val=tempElem.flag;
   //清除右键菜单
   tempElem.fireEvent("onblur");
   if(val==0)
   {

   }
   else if(val==1)
   {

   }
   else if(val==2)
   {

   }
  }
 }catch(e){
  //alert(e.description);
 }
}


最后在onmousedown事件中加载“desk_rightClick()”;

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值