<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
div.line:hover{
background: yellow;
border-radius: 2px;
}
</style>
<script type="text/javascript" src="../js/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
/*$(function() {
$("<div><p>Hello</p></div>").appendTo("body");
$('div').css({'border':'1px solid gray','text-align':'center'});
});*/
function rightbt(evt) {
var msgObj=document.getElementById("contextMenu");
document.getElementById("contextMenu").innerHTML="<div class='line'>save</div>"
+"<div class='line'>edit</div>"
+"<div class='line'>delete</div>";
var moveTop = parseInt(evt.clientY);
var moveLeft = parseInt(evt.clientX);
msgObj.style.position='absolute';
msgObj.style.left=moveLeft+ "px";
msgObj.style.top=moveTop+ "px";
msgObj.style.border='1px solid gray';
msgObj.style.width = 60+'px';
msgObj.style.height = 65+'px';
msgObj.style.display = 'block';
$('div.line').css({"line-height":"20px","font-size":14,"font-weight":"bold"});
if (document.getElementsByClassName('line')) {
$('div.line').live('click', function() {
msgObj.style.display = 'none';
});
}
return false;
}
document.oncontextmenu = rightbt;
</script>
</head>
<body>
<div id="contextMenu"></div>
<div id="myMenudiv"></div>
</body>
</html>
分享到：
相关推荐
标题“echarts右键菜单实例 --- 不修改源码”表明我们将探讨如何在ECharts图表上添加右键菜单，而无需直接修改ECharts的源代码。这意味着我们将通过ECharts的API和事件监听来实现这一功能，这是一个常见的最佳实践，...
在本文中，我们将深入探讨如何使用ECharts 2.2.7版本实现组织结构图（Tree）以及自定义右键菜单，以帮助你更好地理解和应用这一功能。 首先，组织结构图在ECharts中是一种层次结构数据的展示方式，常用于表示公司、...
在计算机用户界面设计中，右键菜单（通常称为ContextMenu）是一种常见的交互元素，它为用户提供了一种快捷方式来访问特定的操作或功能。本教程将详细讲解三种不同的ContextMenu实现方法，帮助开发者更好地理解和应用...
在本文中，我们将深入探讨如何在WPF应用中利用MVVM模式动态加载并管理TreeView，同时实现节点的重命名和右键菜单功能。WPF（Windows Presentation Foundation）是微软提供的一个用于构建桌面应用程序的框架，而MVVM...
《Vue2.x中的v-contextmenu：打造高效便捷的右键菜单》 在现代Web开发中，Vue.js作为一款流行的前端框架，以其轻量级、易上手和强大的特性深受开发者喜爱。而在实际应用中，右键菜单作为一种常见的交互元素，能够...
通过React Context Menu，开发者可以轻松地在React应用中实现交互式的右键菜单，为用户提供更加直观和高效的操作方式。它不仅简化了代码，还提高了可维护性和复用性。在实际项目中，这个库可以与其他React组件和库...
例如，一个后台音乐播放器程序，可以将其图标隐藏在系统托盘，用户通过右键点击托盘图标，出现“播放”、“暂停”、“上一曲”、“下一曲”等菜单项，实现对播放器的控制。这既保持了桌面的整洁，又方便了用户操作。...
在Android开发中，Context Menu是一种常见的用户交互设计，它允许用户在长按或者右键点击一个视图或控件时，弹出一个包含多个选项的菜单。本篇将深入探讨如何在Android应用中实现带有图标的Context Menu，以及相关的...