HTML中 JS 右键

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
 <!-- saved from url=(0053)http://www.7dspace.com/files/download/contentmenu.htm -->  
 <HTML>
 <
HEAD>
  <
TITLE></TITLE>   <META http-equiv=Content-Type content="text/html; charset=gb2312">    <STYLE>
    BODY {     FONT-SIZE: 12px; MARGIN: 10px 0px 0px; FONT-FAMILY: "宋体"     }     .skin0 {     BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; VISIBILITY: hidden;
        BORDER-LEFT
: black 2px solid; WIDTH: 100px; CURSOR:default; LINE-HEIGHT: 20px;
        PADDING-TOP
: 4px; BORDER-BOTTOM: black 2px solid; FONT-FAMILY: "宋体"; POSITION: absolute;
       BACKGROUND-COLOR: menu; TEXT-ALIGN: left     }     .skin1 {     BORDER-RIGHT: buttonhighlight 2px outset; BORDER-TOP: buttonhighlight 2px outset;
        FONT-SIZE
: 10pt; VISIBILITY: hidden; BORDER-LEFT: buttonhighlight 2px outset;
        
WIDTH: 100px; CURSOR: default; PADDING-TOP: 4px; BORDER-BOTTOM: buttonhighlight 2px outset;
        FONT-FAMILY
: "宋体"; POSITION: absolute; BACKGROUND-COLOR: menu; TEXT-ALIGN: left     }     .menuitems {     PADDING-RIGHT: 1px; PADDING-LEFT: 10px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px     }   </STYLE>   <SCRIPT language=javascript>     <!--       //定义菜单显示的外观,可以从上面定义的2种格式中选择其一       var menuskin = "skin0";       //是否在浏览器窗口的状态行中显示菜单项目条对应的链接字符串       var display_url = false;       function getEvent(){ //同时兼容ie和ff的写法     if(document.all)
            return window.event;     func=getEvent.caller;     while(func!=null){     var arg0=func.arguments[0];     if(arg0){     if((arg0.constructor==Event || arg0.constructor ==MouseEvent)     || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){       return arg0;     }     }     func=func.caller;      }     return null;       }     function showmenuie5() {       //获取当前鼠标右键按下后的位置,据此定义菜单显示的位置       var event=arguments[0] || window.event;       var rightedge = document.body.clientWidth-event.clientX;       var bottomedge = document.body.clientHeight-event.clientY;       //如果从鼠标位置到窗口右边的空间小于菜单的宽度,就定位菜单的左坐标(Left)为当前鼠标位置向左一个菜单宽度       if (rightedge <ie5menu.offsetWidth)       ie5menu.style.left = document.body.scrollLeft + event.clientX - ie5menu.offsetWidth;       else         //否则,就定位菜单的左坐标为当前鼠标位置       ie5menu.style.left = document.body.scrollLeft + event.clientX;         //如果从鼠标位置到窗口下边的空间小于菜单的高度,就定位菜单的上坐标(Top)为当前鼠标位置向上一个菜单高度       if (bottomedge <ie5menu.offsetHeight)       ie5menu.style.top = document.body.scrollTop + event.clientY - ie5menu.offsetHeight;       else         //否则,就定位菜单的上坐标为当前鼠标位置       ie5menu.style.top = document.body.scrollTop + event.clientY;         //设置菜单可见       ie5menu.style.visibility = "visible";       return false;     }     function hidemenuie5() {       //隐藏菜单       //很简单,设置visibility为hidden就OK!       ie5menu.style.visibility = "hidden";     }   function highlightie5(evt) {     //高亮度鼠标经过的菜单条项目     //如果鼠标经过的对象是menuitems,就重新设置背景色与前景色     //event.srcElement.className表示事件来自对象的名称,必须首先判断这个值,这很重要!     var event=evt || window.event;     var element=event.srcElement || event.target;     if (element.className == "menuitems") {        element.style.backgroundColor = "highlight";       element.style.color = "white";       //将链接信息显示到状态行       //event.srcElement.url表示事件来自对象表示的链接URL       if (display_url)         window.status = event.srcElement.url;     }     }     function lowlightie5(evt) {     //恢复菜单条项目的正常显示     var event=evt || window.event;     var element=event.srcElement || event.target;     if (element.className == "menuitems") {       element.style.backgroundColor = "";       element.style.color = "black";       //window.status = "";   }   }    //右键下拉菜单功能跳转   function jumptoie5(evt) {     //转到新的链接位置     var event=evt || window.event;     var element=event.srcElement || event.target;     //var seltext=window.document.selection.createRange().text     if (element.className == "menuitems") {     //如果存在打开链接的目标窗口,就在那个窗口中打开链接     if (element.getAttribute("target") != null) {       window.open(element.getAttribute("url"), element.getAttribute("target"));     } else       //否则,在当前窗口打开链接       window.location = element.getAttribute("url"); } } //--> </SCRIPT> <META content="MSHTML 6.00.2900.3059" name=GENERATOR></HEAD> <BODY> <CENTER> <P>点击右键看看效果-<A href="http://www.7dspace.com/" target=_blank>七度空间网页教学网</A> </P></CENTER> <br> <b id="test">点击右键看看效果</b> <br> <br> <br> <b id="test1">点击右键看看效果</b> <DIV class=skin0 id=ie5menu onmouseover=highlightie5(event) onclick=jumptoie5(event); onmouseout=lowlightie5(event)> <DIV class=menuitems url="javascript:history.back();">后退</DIV> <DIV class=menuitems url="javascript:history.forward();">前进</DIV> <HR> <DIV class=menuitems target="_blank">Menu1</DIV> <DIV class=menuitems target="_blank">Menu2</DIV> <DIV class=menuitems target="_blank">Menu3</DIV> <DIV class=menuitems target="_blank">Menu4</DIV> <HR> <DIV class=menuitems target="_blank">Menu5</DIV> <DIV class=menuitems target="_blank">Menu6</DIV> <HR> <DIV class=menuitems target="_blank">Menu7</DIV> <DIV class=menuitems >Menu8</DIV> </DIV> <SCRIPT language=JavaScript1.2> //如果当前浏览器是Internet Explorer,document.all就返回真 //选择菜单方块的显示样式 //ie5menu=document.getElementById("ie5menu"); ie5menu.className = menuskin; //重定向鼠标右键事件的处理过程为自定义程序showmenuie5 document.getElementById("test").oncontextmenu = showmenuie5; document.getElementById("test1").oncontextmenu = showmenuie5; //重定向鼠标左键事件的处理过程为自定义程序hidemenuie5 document.body.onclick = hidemenuie5; </SCRIPT> </BODY>
</
HTML>

 

posted @ 2012-11-02 17:38  残星  阅读(1858)  评论(0编辑  收藏  举报