用Popup对象构建网页右键菜单

单击这里下载这段视频。

代码如下：


 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2 <html>
 3 <head>
 4 <TITLE>Popup对象实现右键菜单</TITLE>
 5 <script language="JavaScript">
 6 var oPopup = window.createPopup();
 7 function contextMenu()
 8 {
 9    
10     var left = event.offsetX+10;
11     var top = event.offsetY+10;
12     oPopup.document.body.innerHTML = oContext.innerHTML;
13     oPopup.show(left, top, 120, 80, window.document.body);
14    
15 }
16 </script>
17 </head>
18 <body oncontextmenu="contextMenu(); return false;">
19 <h1>Popup对象实现右键菜单</h1>
20 单击鼠标右键查看效果
21 <div ID="oContext" style="DISPLAY: none; BACKGROUND: #e4e4e4; ">
22     <div onmouseover="this.style.background='gold'"
23          onmouseout="this.style.background='#e4e4e4'"
24        <span onclick='parent.location.href="http://www.zol.com.cn"'>
25     中关村在线</span>
26     </div>
27     <div onmouseover="this.style.background='gold'"
28          onmouseout="this.style.background='#e4e4e4'"
29     <span onclick="parent.location.href='http://www.cfan.com.cn'">
30     电脑爱好者</span>
31     </div>
32     <div onmouseover="this.style.background='gold';"
33          onmouseout="this.style.background='#e4e4e4';">
34     <span onclick="parent.location.href='http://www.sina.com.cn'">
35     新浪网</span>
36     </div>
37     <div onmouseover="this.style.background='gold'"
38          onmouseout="this.style.background='#e4e4e4'"
39     <span onclick="parent.location.href='http://www.xinhuanet.com'">
40     新华网</span>
41     </div>
42    
43 </div>
44 </body>
45 </html>

 

 

posted @ 2006-08-05 19:54  大天使泰瑞尔  阅读(499)  评论(0)    收藏  举报