我的一亩三分地 我就喜欢!
13fen  设为主页
 收藏本站
 
当前位置: > 一亩三分地:首页 > 网络学院 > 网页设计 > JS特效 > 实现Web页面上的右键快捷菜单
热门文章排行
热门文章排行 网页上传常见问题分析(11-24)
五彩缤纷建网页(一)(10-11)
五彩缤纷建网页(二)(10-11)
五彩缤纷建网页(三)(10-11)
五彩缤纷建网页(四)(10-11)
精采文章排行
精采文章排行 网页技巧二十例(11-13)
模仿QQ和MSN消息提示的效果(11-13)
根据分辨率不同调用不同的css文件(11-13)
Dreamweaver 基础 :DW的"文档"工具(11-01)
Dreamweaver 基础 :DW的"文档"窗口(11-01)
技术专题推荐
网管论坛交流
 

实现Web页面上的右键快捷菜单 

作者:佚名   来源:Linux 宝库   点击:   日期:2006-11-24


-->

样式代码:


<style type="text/css">
   body{font: 9pt "宋体"; margintop: 0px ; color: red; background: #ffffff}
   a.{ font: 9pt "宋体"; cursor: hand; font-size: 9pt ; color: blue; text-decoration: none }
   a:active{ font: 9pt "宋体"; cursor: hand; color: #FF0033 }
   a.cc:hover{ font: 9pt "宋体"; cursor: hand; color: #FF0033}
   .box{ font: 9pt "宋体"; position: absolute; background: LightGrey; }
  </style>


html代码如下:


  <table id="itemopen" class="box" style="DISPLAY:none">
   <tr>
    <td>弹出菜单</td>
   </tr>
   <tr>
    <td><a href="http://blog.csdn.net/Erickson/" class="cc">Erickson的专栏</a></td>
   </tr>
   <tr>
    <td><a href="http://www.csdn.net" class="cc">CSDN</a></td>
   </tr>
   <tr>
    <td><a href="http://www.google.com" class="cc">Google 搜索</a></td>
   </tr>
   <tr>
    <td><a href="http://www.sohu.com" class="cc">搜狐</a></td>
   </tr>
   <tr>
    <td><a href="http://www.yahoo.com" class="cc">Yahoo</a></td>
   </tr>
   <tr>
    <td><a href="http://www.163.com" class="cc">163 网站</a></td>
   </tr>
   <tr>
    <td><a href="http://sports.sina.com.cn" class="cc">新浪网体育</a></td>
   </tr>
   </table>


脚本代码:


右击鼠标显示快捷菜单:
  <script language="JavaScript">
   document.onmousedown = function popUp() {
    menu = document.all.itemopen
    if (event.button == 2) {
    newX = window.event.x + document.body.scrollLeft
    newY = window.event.y + document.body.scrollTop
    menu.style.display = ""
    menu.style.pixelLeft = newX
    menu.style.pixelTop = newY
    }
    else if (event.button == 1)
    {
     menu.style.display = "none"
    }
   }
  </script>


屏蔽IE默认的WinForm快捷菜单:
  <script language="JavaScript">
   var message="";
   function clickIE()
   {
    if (document.all)
    {
     (message);
     return false;
    }
   }
   function clickNS(e)
   {
    if (document.layers||(document.getElementById&&!document.all))
    {
     if (e.which==2)
     {
      newX = window.event.x + document.body.scrollLeft
      newY = window.event.y + document.body.scrollTop
      menu = document.all.itemopen
      if ( menu.style.display == "")
      {
       menu.style.display = "none"
      }
      else
      {
       menu.style.display = ""
      }
      menu.style.pixelLeft = newX
      menu.style.pixelTop = newY
     }
     if (e.which==3)
     {
      (message);
      return false;
     }
    }
   }
   if (document.layers)
   {
    document.captureEvents(Event.MOUSEDOWN);
    document.onmousedown=clickNS;
   }
   else
   {
    document.onmouseup=clickNS;document.oncontextmenu=clickIE;
   }
   document.oncontextmenu=new Function("return false")
  </script>





文章评论】 【收藏本文】 【推荐好友】 【打印本文】 【论坛讨论

   相关文章:
·在状态栏中实现活动文字效果 ·DW+ASP玩转动态二级菜单
·鼠标事件的基础和完美实现 ·DW滑动菜单的制作
·网页里震动的效果怎么做 ·灵活运用DREAMWEAVER的SITE功能

   文章评论:(条)
  
 请留名: 匿名评论   点击查看所有评论 网管论坛
 

  责任编辑:一分  声明:刊登此文章是为了传递更多信息,文章内容仅供参考,转载请注明出处。