js 自定义右键菜单

  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>Title</title>
  </head>
        <style>
            * {margin:0; padding:0;}
            #ul1 {width:100px; background:#CCC; border:1px solid black; position:absolute; display:none;}
        </style>
        <script>
//右键菜单事件
      document.oncontextmenu=function (ev) {
          var scllTop=document.documentElement.scrollTop||document.body.scrollTop;
          var scrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft;


          var oEvent=ev||event;
          var oUl=document.getElementById("ul1");
          oUl.style.listStyle="none";
          oUl.style.display="block";
          oUl.style.left=oEvent.clientX+scrollLeft+"px";
          oUl.style.top=oEvent.clientY+scllTop+"px";


          return false;//是阻止默认的右键事件，
      };

      document.onclick=function () {
          var oUl=document.getElementById("ul1");
          oUl.style.display="none";
}
  </script>


  <body style="height: 2000px">

  <ul id="ul1">
      <li>登录</li>
      <li>ss</li>
      <li>kk</li>
      <li>加入</li>
  </ul>

  </body>
  </html>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容