js右键菜单效果代码


Posted in Javascript onJuly 21, 2007

将以下代码添加到<head>与</head>之间 
---------------------------------- 

<script language='javascript'> 
/*******以下内容可以修改***************/ 
var mname=new Array( 
"首  页", 
"修  改", 
"下  载", 
"删  除", 
"新  建", 
"刷  新" 
); 
//mname是菜单对应的名称,数组的个数必须与下面murl对应 

var murl=new Array( 
"window.open('http://www.cn5.cn','_blank','');", 
"alert('修改');", 
"alert('download');", 
"alert('delete');", 
"alert('new');", 
"alert('refresh');" 
); 
//murl是菜单对应的操作,可以是任意javascript代码但是要注意不要在里面输入\",只能用' 
//如果要实现跳转可以这样window.location='url';  
var ph=18,mwidth=50;//每条选项的高度,菜单的总宽度 
var bgc="#eee",txc="black";//菜单没有选中的背景色和文字色 
var cbgc="darkblue",ctxc="white";//菜单选中的选项背景色和文字色 

/****************以下代码请不要修改******************/ 
var mover="this.style.background='"+cbgc+"';this.style.color='"+ctxc+"';" 
var mout="this.style.background='"+bgc+"';this.style.color='"+txc+"';" 

document.oncontextmenu=function() 
{  
 mlay.style.display=""; 
 mlay.style.pixelTop=event.clientY; 
 mlay.style.pixelLeft=event.clientX; 
 return false; 

function showoff() 

 mlay.style.display="none"; 

function fresh() 

 mlay.style.background=bgc; 
 mlay.style.color=txc; 
 mlay.style.width=mwidth; 
 mlay.style.height=mname.length*ph; 
 var h="<table width=100% height="+mname.length*ph+"px cellpadding=0  cellspacing=0 border=0>"; 
 var i=0; 
 for(i=0;i<mname.length;i++) 
 { 
  h+="<tr align=center height="+ph+" onclick=\""+murl[i]+"\" onMouseover=\""+mover+"\" onMouseout=\""+mout+"\"><td style='font-size:9pt;'>"+mname[i]+"</td></tr>"; 
 } 
 h+="</table>"; 
 mlay.innerHTML=h; 

</script> 

---------------------------------- 
将以下代码替换<body>标签 
---------------------------------- 
<body onClick="showoff();" onload="fresh();">
---------------------------------- 
在<body>与</body>之间插入以下代码 
---------------------------------- 
<div id="mlay" style="position:absolute;display:none;cursor:default;" onClick="return false;"></div>
---------------------------------- 
完!!! 
:) 

Javascript 相关文章推荐
asp.net HttpHandler实现图片防盗链
Nov 09 Javascript
javascript学习笔记(三)BOM和DOM详解
Sep 30 Javascript
AngularJS自动表单验证
Feb 01 Javascript
Bootstrap布局组件教程之Bootstrap下拉菜单
Jun 12 Javascript
返回函数的JavaScript函数
Jun 14 Javascript
angularjs 源码解析之injector
Aug 22 Javascript
jQuery实现单击按钮遮罩弹出对话框效果(2)
Feb 20 Javascript
从零学习node.js之简易的网络爬虫(四)
Feb 22 Javascript
puppeteer实现html截图的示例代码
Jan 10 Javascript
详解async/await 异步应用的常用场景
May 13 Javascript
javascript for循环性能测试示例
Aug 07 Javascript
jquery插件实现悬浮的菜单
Apr 24 jQuery
$()JS小技巧
Jul 21 #Javascript
IE 缓存策略的BUG的解决方法
Jul 21 #Javascript
用JS实现的一个include函数
Jul 21 #Javascript
代码精简的可以实现元素圆角的js函数
Jul 21 #Javascript
发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载
Jul 21 #Javascript
用javascript实现读取txt文档的脚本
Jul 20 #Javascript
符合W3C网页标准的iframe标签的使用方法
Jul 19 #Javascript
You might like
《PHP编程最快明白》第二讲 数字、浮点、布尔型、字符串和数组
2010/11/01 PHP
PHP中字符安全过滤函数使用小结
2015/02/25 PHP
当前页禁止复制粘贴截屏代码小集
2013/07/24 Javascript
原生javascript获取元素样式
2014/12/31 Javascript
实例讲解js验证表单项是否为空的方法
2016/01/09 Javascript
H5手机端多文件上传预览插件
2017/04/21 Javascript
Angularjs 与 bower安装和使用详解
2017/05/11 Javascript
在vue.js中抽出公共代码的方法示例
2017/06/08 Javascript
angular.js实现购物车功能
2017/10/23 Javascript
JS立即执行的匿名函数用法分析
2019/11/04 Javascript
解决vue v-for src 图片路径问题 404
2019/11/12 Javascript
使用uni-app开发微信小程序的实现
2019/12/13 Javascript
用云开发Cloudbase实现小程序多图片内容安全监测的代码详解
2020/06/07 Javascript
python使用socket进行简单网络连接的方法
2015/04/29 Python
举例详解Python中threading模块的几个常用方法
2015/06/18 Python
用Python的Django框架来制作一个RSS阅读器
2015/07/22 Python
Python 爬虫之超链接 url中含有中文出错及解决办法
2017/08/03 Python
python自动截取需要区域,进行图像识别的方法
2018/05/17 Python
OpenCV+Python识别车牌和字符分割的实现
2019/01/31 Python
pycharm创建一个python包方法图解
2019/04/10 Python
python列表每个元素同增同减和列表元素去空格的实例
2019/07/20 Python
python绘图模块matplotlib示例详解
2019/07/26 Python
关于pycharm中pip版本10.0无法使用的解决办法
2019/10/10 Python
Python HTTP下载文件并显示下载进度条功能的实现
2020/04/02 Python
Windows下Sqlmap环境安装教程详解
2020/08/04 Python
基于python tkinter的点名小程序功能的实例代码
2020/08/22 Python
python中time tzset()函数实例用法
2021/02/18 Python
详解HTML5中垂直上下居中的解决方案
2017/12/20 HTML / CSS
编程实现去掉XML的重复结点
2014/05/28 面试题
音乐学个人的自荐书范文
2013/11/26 职场文书
应用心理学个人求职信范文
2013/12/11 职场文书
夫妻双方自愿离婚协议书
2014/10/24 职场文书
中标通知书格式
2015/04/17 职场文书
2016教师给学生的毕业寄语
2015/12/04 职场文书
Golang 空map和未初始化map的注意事项说明
2021/04/29 Golang
Python必备技巧之字符数据操作详解
2022/03/23 Python