js实现右键自定义菜单
本文实例为大家分享了右键自定义菜单的具体代码,供大家参考,具体内容如下
<!DOCTYPEhtml> <html> <head> <metacharset="UTF-8"> <title></title> <styletype="text/css"> #menu{ height:200px; width:50px; border:1pxsolidgray; background-color:antiquewhite; padding:10px; display:none; position:absolute; } ul, li{ margin:0; padding:0; list-style-type:none; line-height:40px; } </style> </head> <body> <divid="menu"> <ul> <li>复制</li> <li>粘贴</li> <li>运行</li> <li>工具</li> <li>帮助</li> </ul> </div> </body> <scripttype="text/javascript"> varmenu=document.getElementById("menu"); document.oncontextmenu=function(ev){ varoEvent=ev||event; //自定义的菜单显示 menu.style.display="block"; //让自定义菜单随鼠标的箭头位置移动 menu.style.left=oEvent.clientX+"px"; menu.style.top=oEvent.clientY+"px"; //returnfalse阻止系统自带的菜单, //returnfalse必须写在最后,否则自定义的右键菜单也不会出现 returnfalse; } //实现点击document,自定义菜单消失 document.onclick=function(){ menu.style.display="none"; } </script> </html>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。