JS自定义鼠标右键菜单

<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>自定义鼠标右键菜单</title><style>* {margin: 0;padding: 0;}#list {width: 60px;background: #CCC;border: 1px solid black;position: absolute;display: none;list-style: none;border-bottom: none;}#list li {height: 30px;line-height: 30px;text-align: center;border-bottom: 1px solid #000;}</style></head><body><ul id="list"><li>登 陆</li><li>退 出</li><li>注 销</li><li>走 人</li></ul><script>document.oncontextmenu = function (ev) {var myEvent = ev || event;var list = document.getElementById('list');list.style.display = 'block';list.style.left = myEvent.clientX + 'px';list.style.top = myEvent.clientY + 'px';return false;};document.onclick = function () {var list = document.getElementById('list');list.style.display = 'none';};</script></body></html>

JS自定义鼠标右键菜单相关推荐

如何在canvas画布上自定义鼠标右键菜单内容？
用户大大提了一个需求,想要在画布上能够右键快捷点击使用某个功能,小菜鸟肯定要满足啊(委屈脸),然后靠着强大的各路神仙,写下了如下代码,终于实现了,为自己放个烟花~~~不喜勿喷哦~ 1.自定义鼠标右键菜 ...
JQuery模拟网页中自定义鼠标右键菜单
题外话.......最近在开发一个网站项目的时候,需要用到网页自定义右键菜单,在网上看了各路前辈大神的操作,头晕目眩,为了达到目的,突然灵机一动,于是便有了这篇文章. 先放个效果图(沾沾自喜,大神勿喷 ...
html自定义鼠标右键,js自定义鼠标右键的实现原理及源码
今天来记录下js来自定义鼠标右键,同样先来分解下它的实现原理: 1.屏蔽右键默认事件:(一度我以为修改的就是默认事件) 2.对一个ul的隐藏:(这个我也曾迂腐的认为值得这样操作的都是div,汗) 3. ...
html 元素允许右键,JavaScript 自定义html元素鼠标右键菜单功能
自定义html元素鼠标右键菜单实现思路在触发contextmenu事件时,取消默认行为(也就是阻止浏览器显示自带的菜单),获取右键事件对象,来确定鼠标的点击位置,作为显示菜单的left和top值 ...
前端自定义网页鼠标右键菜单
//监听全局上下文菜单 document.addEventListener('contextmenu', function(e){//阻止默认e.preventDefault()//自定义鼠标右键菜单 ...
自定义html页面鼠标右键,javascript鼠标右键菜单自定义效果
本文实例讲解了javascript鼠标右键菜单的实现方法,分享给大家供大家参考,具体内容如下效果图: 具体代码: #menu{ border:solid 1px gray; width:100px; ...
稳扎稳打Silverlight(29) - 2.0Tip/Trick之Cookie, 自定义字体, 为程序传递参数, 自定义鼠标右键...
[索引页] [源码下载] 稳扎稳打Silverlight(29) - 2.0Tip/Trick之Cookie, 自定义字体, 为程序传递参数, 自定义鼠标右键, 程序常用配置参数作者:webabcd ...
openlayer右键菜单_使用OpenLayers3 添加地图鼠标右键菜单
添加右键菜单,首先我们要监听鼠标右键点击的操作,我们知道鼠标右键事件名是 contextmenu,当鼠标在 html 元素之上,点击鼠标右键,便会触发 contextmenu 事件,在 context ...
Leaflet中使用Leaflet.contextmenu插件实现地图上添加鼠标右键菜单
场景 Leaflet快速入门与加载OSM显示地图: Leaflet快速入门与加载OSM显示地图_BADAO_LIUMANG_QIZHI的博客-CSDN博客在上面的基础上,怎样使用Leaflet.co ...
jquery-11 如何制作鼠标右键菜单
jquery-11 如何制作鼠标右键菜单一.总结一句话总结:核心原理:找到右键菜单事件contextmenu,return false去掉默认事件,然后判断用户是否点的右键,然后在鼠标的位置显示菜 ...

JS自定义鼠标右键菜单

JS自定义鼠标右键菜单相关推荐

最新文章

热门文章