Dreamweaver教程 FrontPage教程 Flash教程 CSS教程
  • javascript教程
  • 当前位置:教程 > 网页制作 > javascript教程 > 正文

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

    编辑:教程网 来源:网络 时间:2011年10月27日 16:53

    代码如下:

    <!DOCTYPE HTML PUBLIC "//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <TITLE>Popup对象实现右键菜单</TITLE>
    <script language="JavaScript">
    var oPopup = window.createPopup();
    function contextMenu()
    {

    var left = event.offsetX+10;
    var top = event.offsetY+10;
    oPopup.document.body.innerHTML = oContext.innerHTML;
    oPopup.show(left, top, 120, 80, window.document.body);

    }
    </script>
    </head>
    <body oncontextmenu="contextMenu(); return false;">
    <h1>Popup对象实现右键菜单</h1>
    单击鼠标右键查看效果
    <div ID="oContext" style="DISPLAY: none; BACKGROUND: #e4e4e4; ">
    <div onmouseover="this.style.background='gold'"
    onmouseout="this.style.background='#e4e4e4'"
    <span onclick='parent.location.href="http://www.zol.com.cn"'>
    中关村在线</span>
    </div>
    <div onmouseover="this.style.background='gold'"
    onmouseout="this.style.background='#e4e4e4'"
    <span onclick="parent.location.href='http://www.cfan.com.cn'">
    电脑爱好者</span>
    </div>
    <div onmouseover="this.style.background='gold';"
    onmouseout="this.style.background='#e4e4e4';">
    <span onclick="parent.location.href='http://www.sina.com.cn'">
    新浪网</span>
    </div>
    <div onmouseover="this.style.background='gold'"
    onmouseout="this.style.background='#e4e4e4'"
    <span onclick="parent.location.href='http://www.xinhuanet.com'">
    新华网</span>
    </div>

    </div>
    </body>
    </html>


  • 原文来自 教程网 转载请注明:http://www.websmill.com/wangye/javascript/29900.html

  • 上一篇:Javascript实例教程(3) 探测浏览器插件
  • 下一篇:JavaScript中的字符串操作