jq自定义鼠标右键菜单
效果:

代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="test/datatables/jquery-1.10.2.js"></script>
<style>
*{
padding:0;
margin:0;
}
.button{
width:200px;
height:50px;
background:grey;
text-align:center;
line-height:50px;
margin:0 auto;
margin-top:50px;
}
.menu{
padding: 1px;
border: 1px solid #B8CBCB;
background-color: #fff;
-moz-box-shadow: 2px 2px 5px #666;
-webkit-box-shadow: 2px 2px 5px #666;
box-shadow: 2px 2px 5px #666;
width:140px;
position:absolute;
display:none;
}
ul li{
list-style:none;
}
.li_separate{
line-height: 0;
margin: 3px;
border-bottom: 1px solid #B8CBCB;
font-size: 0;
}
.menu_a{
display: block;
height: 25px;
line-height: 24px;
padding: 0 5px 0 25px;
color: #000;
font-size: 12px;
text-decoration: none;
}
.menu_a:hover{
background: #348CCC;
color:white;
}
</style>
</head>
<body>
<div class="button">点击</div>
<div class="menu">
<ul>
<li><a href="javascript:;" class="menu_a">复制</a></li>
<li><a href="javascript:;" class="menu_a">粘贴</a></li>
<li class="li_separate"></li>
<li><a href="javascript:;" class="menu_a">删除</a></li>
</ul>
</div>
<script>
//屏蔽浏览器右键菜单
document.oncontextmenu=function(){
return false;
}
$('.button').on('mousedown',function(e){
var key=e.which;//获取鼠标键位
if(key==3){//1:代表左键;2:代表中键;3:代表右键
//获取右键点击坐标
var x=e.clientX;
var y=e.clientY;
$('.menu').show().css({left:x,top:y});
}
})
//点击任意部位隐藏
$(document).on('click',function(){
$('.menu').hide();
})
</script>
</body>
</html>
jq自定义鼠标右键菜单的更多相关文章
- js自定义鼠标右键菜单
document.oncontextmenu = function(e) { return false; } document.onmousedown = function(e) { switch(e ...
- JavaScript自定义鼠标右键菜单
下面为JavaScript代码 window.onload = function () { //好友列表 var f = 0; //判断指定id的元素在页面中是否存在 if (document.get ...
- JQuery模拟网页中自定义鼠标右键菜单
题外话.......最近在开发一个网站项目的时候,需要用到网页自定义右键菜单,在网上看了各路前辈大神的操作,头晕目眩,为了达到目的,突然灵机一动,于是便有了这篇文章. 先放个效果图(沾沾自喜,大神勿喷 ...
- Win10 自定义鼠标右键菜单
1. 点击文件鼠标右键显示软件 1.1 步骤 win+R输入regedit进入注册表 定位到HKEY_CLASSES_ROOT\*\shell下 在shell创建一个你想要的右键文件 例如:Kinok ...
- Win7如何自定义鼠标右键菜单 添加用记事本打开
鼠标右键用记事本打开.reg Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\*\shell\Notepad] @="用记事本 ...
- Win7如何自定义鼠标右键菜单 添加新建WORD文档
鼠标右键添加新建WORD文档.reg Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\.doc] @="Word.Docume ...
- Win7如何自定义鼠标右键菜单 添加新建文本文档
鼠标右键新建文本文档.reg REGEDIT4 [HKEY_CLASSES_ROOT\.txt] @="txtfile" "Content Type"=&quo ...
- Win7如何自定义鼠标右键菜单 添加新建EXCEL文档
鼠标右键添加新建EXCEL文档.reg Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\.xls] "Content Type ...
- Win7如何自定义鼠标右键菜单 添加新建PowerPoint文档
鼠标右键添加新建PowerPoint文档.reg Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\.ppt] "Content ...
随机推荐
- http协议基础教程
引言 HTTP 是一个属于应用层的面向对象的协议,由于其简捷.快速的方式,适用于分布式超媒体信息系统.它于1990年提出,经过几年的使用与发展,得到不断地完善和 扩展.目前在WWW中使用的是HTTP/ ...
- js中的各种宽高
在设计页面时可能经常会用到固定层的位置,这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标,这里可能就会用到document .body.scrollTop等属性,但是此属性在xhtml标准 ...
- LINUX中错误 SELinux is disabled
解决: setenforce: SELinux is disabled 那么说明selinux已经被彻底的关闭了 如果需要重新开启selinux,请按下面步骤: vi /etc/selinux/con ...
- Web性能优化 高并发网站解决 单例 已看1
Web性能优化分为服务器端和浏览器端两个方面. 一.浏览器端,关于浏览器端优化,分很多个方面1.压缩源码和图片JavaScript文件源代码可以采用混淆压缩的方式,CSS文件源代码进行普通压缩,JPG ...
- STM32 C++编程 004 Adc (数模转换)类
使用 C++ 语言给 STM32 编写一个 Adc 类 我使用的STM32芯片:STM32F103ZET6 我们使用的STM32库版本:V3.5.0 注意: 想学习本套 STM32 C++编程 的专栏 ...
- bzoj2134 错选单位
传送门 题目 Input n很大,为了避免读入耗时太多, 输入文件只有5个整数参数n, A, B, C, a1, 由上交的程序产生数列a. 下面给出pascal/C/C++的读入语句和产生序列的语句( ...
- java获取Excel的导入
先准备好这2个架包 import java.io.*; import org.apache.commons.io.FileUtils; import org.apache.poi.hssf.userm ...
- STL 堆的使用
本来是要写leetcode上的merge k sorted lists那道题目,这个题目我还是很熟悉的,毕竟是看过算法导论的人,但是写的过程中对堆的维护代码还是挺多的,所以我想到了STL中的堆.下面就 ...
- jquery ajax 分页2
/* * 分页 $("#divPager").flexipager * 2015.03.17 */ //初始化列表默认属性 (function($) { $.addFlex = f ...
- 说“DPI”
作者:马健邮箱:stronghorse_mj@hotmail.com发布:2007.03.08更新:2007.04.02 目录一.基本概念二.图像文件中的DPI三.PDG文件中的DPI四.PDF文件中 ...