CSS自定义右键菜单
<style>
.menu {
width: 100px;
font-size: 14px;
font-family: "微软雅黑";
border: 1px solid #ccc;
z-index:;
position: absolute;
display: none;
background: #f2f2f2;
} .menu ul {
margin: 0px;
padding: 0px;
text-align: center;
list-style-type: none;
} .menu ul li {
padding: 3px 0px;
font-size: 12px;
} .menu ul li:hover {
background: #e1dddd;
} .menu ul li a:link {
color: #000;
text-decoration: none;
}
</style>
<!--右侧菜单-->
<div id="divmenu" class="menu">
<ul>
<li onclick="expand_all()" class="pub">展开所有</li>
<li onclick="collapse_all()" class="pub">合并所有</li>
<li onclick="zoomIn()" class="pub">画布放大</li>
<li onclick="zoomOut()" class="pub">画布缩小</li>
<li onclick="add_node();" class="add">新增节点</li>
<li onclick="openWin();" class="view">预览</li>
<li onclick="update_node();" class="update">变更</li>
<li onclick="add_upfile();" class="upload">上传图纸</li>
<li onclick="show_selected();" class="sel">查看节点</li>
<li onclick="remove_node()" class="delete">删除</li>
</ul>
</div>
<script type="text/javascript">
$("body").bind("contextmenu", function () {
$("#divmenu").css({ "left": document.body.scrollLeft + event.clientX - 125, "top":
document.body.scrollTop + event.clientY - 60 }).show();
return false;
});
</script>
CSS自定义右键菜单的更多相关文章
- html鼠标自定义右键菜单:css+js实现自定义html右键菜单
我们在网页中很多都有右键菜单的功能,一般点击右键显示的是浏览器默认的菜单选项,那么我们直接如何通过css+js实现html的右键菜单呢?这篇文章将讲解html鼠标自定义右键菜单的实现原理和实现代码. ...
- JavaScript自定义右键菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 自定义右键菜单,禁用浏览器自带的右键菜单[右键菜单实现--Demo]
许多从事Web开发的会发现有些事,我们需要禁用浏览器本事自带的右键菜单,而实现自定义的右键菜单下面我们也来实现一个自定义的右键菜单 首先来创建JSP页面 <%@ page language=&q ...
- JS简单实现自定义右键菜单
RT,一个简单的例子,仅仅讲述原理 <div id="menu" style="width: 0;height: 0;background: cadetblue;p ...
- 【连载】Bootstrap开发漂亮的前端界面之自定义右键菜单
连载: 1<教你用Bootstrap开发漂亮的前端界面> 2.<Bootstrap开发漂亮的前端界面之实现原理> 网页中的自定义右键菜单越来越普遍,自定义右键菜单可以增强用户体 ...
- 阻止右键菜单(阻止默认事件)&&跟随鼠标移动(大图展示)&&自定义右键菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JS学习笔记 - 自定义右键菜单、文本框只能输入数字
<script> // 事件总共有2个部分, //1.点击鼠标右键的表现 oncontextmenu 2.点击鼠标左键的表现(即普通点击onclick) // 点击右键,div位置定位到鼠 ...
- js进阶 12-18 jquery如何实现自定义右键菜单(把问题分细)
js进阶 12-18 jquery如何实现自定义右键菜单(把问题分细) 一.总结 一句话总结:用鼠标右键事件contextmenu,阻止系统默认事件,让做好的右键菜单显示出来,并且显示在我们出现的位 ...
- jquery 自定义右键菜单
如果要自定义右键菜单,那么就需要禁止原本的右键菜单,代码如下 document.oncontextmenu = new Function("return false;");//禁止 ...
随机推荐
- 版本管理·玩转git(日志查看与版本切换)
如果你想更清晰地学习git,你必须要了解3个重要区域. 工作区:即开发者的工作目录 暂存区:修改已被记录,但尚未录入版本库的区域 版本库:存储变化日志及版本信息 当你在工作区进行开发工作时,git会记 ...
- 一文解读ARM架构 (转)
本文主要介绍的是arm架构和x86架构的区别,首先介绍了ARM架构图,其次介绍了x86架构图,最后从性能.扩展能力.操作系统的兼容性.软件开发的方便性及可使用工具的多样性及功耗这五个方面详细的对比了a ...
- 记录C#-WPF线程中如何修改值
new Thread(() => { Application.Current.Dispatcher.BeginInvoke(DispatcherPriority.Normal, new Acti ...
- linux scp命令 将数据从一台linux服务器复制到另一台linux服务器
scp是secure copy的简写,用于在Linux下进行远程拷贝文件的命令,和它类似的命令有cp,不过cp只是在本机进行拷贝不能跨服务器,而且scp传输是加密的.可能会稍微影响一下速度.当你服务器 ...
- MySQL数据库(一)索引
索引的作用是操作数据库时避免全表扫描. 索引的机制 B Tree与B+Tree索引 B(blance) 树可以看作是对2-3查找树的一种扩展,即他允许每个节点有M-1个子节点. 根节点至少有两个子节点 ...
- SpringCloud学习笔记(六、SpringCloud Netflix Feign)
目录: feign简介 feign应用 feign简介: feign是一款Netflix开源的声明式.模板化的http客户端,它可以更加便捷.优雅的调用http api:SpringCloud对Net ...
- 201871010111-刘佳华《面向对象程序设计(java)》第七周学习总结
201871010111-刘佳华<面向对象程序设计(java)>第七周学习总结 实验时间 2019-10-11 1.实验目的与要求 1) 掌握四种访问权限修饰符的使用特点: (1)进一步理 ...
- gitbook 入门教程之解决windows热加载失败问题
破镜如何贴花黄 gitbook 在 Windows 系统无法热加载,总是报错! gitbook 是一款文档编写利器,可以方便地 markdown 输出成美观优雅的 html ,gitbook serv ...
- CentOS7 安装 anaconda
Anaconda是一个开源的Python发行版本,可以帮助我们更方便地配置Python环境. 如果只需要某些包,或者需要节省带宽或存储空间,也可以使用Miniconda这个较小的发行版 0. 开始前 ...
- Physically Based Shader Development for Unity 2017 Develop Custom Lighting Systems (Claudia Doppioslash 著)
http://www.doppioslash.com/ https://github.com/Apress/physically-based-shader-dev-for-unity-2017 Par ...