现在的位置: 首页 > 综合 > 正文

JS : 改变/模拟右键菜单

2014年02月20日 ⁄ 综合 ⁄ 共 3471字 ⁄ 字号 评论关闭

 // JavaScript Document
////Date: 2011-08-06
////author: Tanyong
////QQ:491960352
////对象: RightMenu
////参数:dom 显示的对象,closedom按钮(可选)
////作用: 改变/模拟右键菜单
////平台:firefox,opera,ie
/// /Example:: 
////step 1: Creat htmldivElement
//// <div id="htmldivElement"></div>
////step 2: 设置 css  sytle::
////#htmldivElement{width:100px; height:200px; border:1px solid #000000;  background:#CCC;}
////waring::警告 position="absolute"; 定位必须是绝对
////step 3 在文档中添加 RightMenu.Reg("showElement","closeElement")
////如果不想用html创建可选:RightMenu.Creat(tag,Elementid,h,w)  ////(里面的css属性自己添加修改)
var NoAgreeText = "此操作被浏览器拒绝!请在浏览器地址栏输入 about:config 并回车\n然后将 [signed.applets.codebase_principal_support] 设置为 true";
var ParamErrText = "参数错误/缺少"
       var RightMenu={
  ////构造函数,注册一些事件
   Reg:function (dom,closedom){
    if(!dom){alert(ParamErrText); return false;}
       try{ 
      this._$=this.$(dom);
           var css=this.css=this._$.style;
     this.setAlpha(this._$,50);
      //css.display="none";
       css.position="absolute";
      css.index="999";
      css.left = getinfo.getMouseXY(evt)[0] +"px" //clientX 鼠标X柱
       css.top = getinfo.getMouseXY(evt)[1]  +"px"//clientY 鼠标Y柱
     this.isIe ? css.opacity=0.1:css.opacity=0.65;
         css.zIndex=999;
         //文档右击屏蔽系统正常的菜单,显示自定义htmlElement 
     document.oncontextmenu= function (evt){
         evt = window.event || evt;  // 获取当前事件对象  都是FF 才要这么写的
      css.display="block";  //块状显示
      css.left = getinfo.getMouseXY(evt)[0] +"px" //clientX 鼠标X柱
       css.top = getinfo.getMouseXY(evt)[1]  +"px"//clientY 鼠标Y柱
       return false  //屏蔽系统
          }
      try{if(closedom){
      this.$(closedom).onclick=function (){
       try{document.body.removeChild(this.$(dom));
        }catch(e){
         css.display="none";
           };
          };
         };
        }catch(e){
        return false ;
       };
       }catch(e){
     alert("该对象使用失败\r\n"+e+"\r\n"+ NoAgreeText)
     return false ;
     }
     },  
  ////获取dom节点 element   
  $:function (Element){
   var hmtlElement=(typeof Element=="string" ||typeof Element=="String" )? document.getElementById(Element):Element ;
      return hmtlElement;//返回节点
     },
  // 浏览器判断是否为。为兼容性做扩展 
  isIE: (navigator.appName == "Microsoft Internet Explorer") || window.ActiveXObject?true:false, //ie?
  isfirefox:(navigator.userAgent.toLowerCase().indexOf("firefox")!=-1),//判断是否为firefox
  issafari:(navigator.userAgent.toLowerCase().indexOf("safari")!=-1),//判断是否为safari
  isOpera : (navigator.userAgent.toLowerCase().indexOf("opera")!=-1),//判断是否为Opera
    ///下面为自由扩展,创建divElement
  Creat:function (tag,Elementid,h,w){
   try{
   var div=document.createElement(tag);//创建divElement
   var cssstyle=div.style;  //初始化属性
     div.id=Elementid;  //id
    // cssstyle.display="none";
     cssstyle.height=h+"px"; //高
     cssstyle.width=w+"px"; //宽 
     cssstyle.border="1px solid #000000"; //边框 一厘米 实心线 黑色
     cssstyle.backgroundColor="#cccccc";//背景颜色
     cssstyle.top=999+"px";
     cssstyle.left=999+"px";
     //cssstyle.opacity=0.25
     cssstyle.zIndex=999;
     cssstyle.position="absolute";
     div.innerHTML="<button id=\"c\">close</button>"
     document.getElementsByTagName("body").item(0).appendChild(div);
    }catch(e){
     alert("创建html标签:"+tag+"失败\r\n"+e)
     return false ;
     }
   },
   //透明某个对象
  setAlpha:function(id,num){
   var get=this.$(id);
   if(this.isIE){ //IE
   if(this.$(id)){
    this.$(id).style.filter = "alpha(opacity="+num+")";
   }else{
    id.style.filter = "alpha(opacity="+num+")";
   }
  }else{
   if(this.$(id)){
    this.$(id).style.opacity = parseInt(num)/100;
   }else{
    id.style.opacity = parseInt(num)/100;
   }
  }
 }    
     };
  
var dom=function (Element){
 Element=Element || this;
 return RightMenu.$(Element)
 };    

抱歉!评论已关闭.