右键脚本html,js实现右键自定义菜单

本文实例为大家分享了右键自定义菜单的具体代码，供大家参考，具体内容如下

#menu {

height: 200px;

width: 50px;

border: 1px solid gray;

background-color: antiquewhite;

padding: 10px;

display: none;

position: absolute;

}

ul,

li {

margin: 0;

padding: 0;

list-style-type: none;

line-height: 40px;

}

复制
粘贴
运行
工具
帮助

var menu = document.getElementById("menu");

document.oncontextmenu = function(ev) {

var oEvent = ev || event;

//自定义的菜单显示

menu.style.display = "block";

//让自定义菜单随鼠标的箭头位置移动

menu.style.left = oEvent.clientX + "px";

menu.style.top = oEvent.clientY + "px";

//return false阻止系统自带的菜单，

//return false必须写在最后，否则自定义的右键菜单也不会出现

return false;

}

//实现点击document，自定义菜单消失

document.onclick = function() {

menu.style.display = "none";

}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

右键脚本html,js实现右键自定义菜单相关推荐

使用asp.net mvc,boostrap及knockout.js开发微信自定义菜单编辑工具
前言微信的接口调试工具可以编辑自定义菜单,不过是提交json格式数据创建菜单,非常的不方便还容易出错.网上的工具不好用,所以就自己写了一个. 正文先用bootstrap排个页面框架出来,调用自定义 ...
使用Bootstrap制作右键单击自定义菜单
我们可以轻松地通过右键单击创建一个漂亮的自定义菜单. 让我们创建一个div右键单击启用自定义菜单. <div class="col-lg-6 bg-info" id=&quo ...
Element 组件之右键鼠标自定义菜单
参考链接: Element 组件之右键鼠标自定义菜单 Vue+ElementUI实现给Tab页添加鼠标右键菜单栏 Element tree组件之自定义菜单基于element tree组件.效果 ...
js实现右键单击打开自定义的菜单
今天分享一个,单击鼠标右键弹出自定义菜单,选中不同菜单选项,实现其对应功能首先先自已定义一个菜单 <div id="menu"><ul><li ...
JS简单实现自定义右键菜单
今天来讲一个关于右键菜单的小demo,抛砖引玉. 首先,我们要用css和html做一个自定义右键菜单.  <div id="menu ...
前端实现右键自定义菜单
大家好,我是前端西瓜哥. 本文将讲解 Web 页面如何实现自定义菜单功能. 线上 demo: https://codepen.io/F-star/pen/WNOvQVQ 思路核心思路是:注册 con ...
JavaScript学习（三十七）—实现右键自定义菜单的功能
JavaScript学习(三十七)-实现右键自定义菜单的功能代码如下: <!DOCTYPE html> <html lang="en"><head& ...
网站禁用鼠标右键php代码,JS实现禁止鼠标右键的功能
遇到网页上有精美图片或者精彩文字想保存时,通常大家都是选中目标后按鼠标右键,在弹出菜单中选择"图片另存为"或"复制"来达到我们的目的.但是,目前有许多网页都屏蔽 ...
Win10 右键新建没有WORD文档创建菜单？
环境: Win10 专业版问题描述: 右键新建没有WORD文档创建菜单? 解决方案: 1.打开注册表,计算机\HKEY_CLASSES_ROOT.docx,右侧默认数值改为Word.Document ...

右键脚本html,js实现右键自定义菜单

右键脚本html,js实现右键自定义菜单相关推荐

最新文章

热门文章