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 相关文章推荐
jQuery选择器源码解读(七):elementMatcher函数
Mar 31 Javascript
简单谈谈JavaScript的同步与异步
Dec 31 Javascript
JS基础随笔(菜鸟必看篇)
Jul 13 Javascript
jQuery Dialog 取消右上角删除按钮事件
Sep 07 Javascript
javascript数组对象常用api函数小结(连接,插入,删除,反转,排序等)
Sep 20 Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
Sep 23 Javascript
js拼接html字符串的注意事项
Oct 13 Javascript
详细分析单线程JS执行问题
Nov 22 Javascript
使用jquery DataTable和ajax向页面显示数据列表的方法
Aug 09 jQuery
基于Proxy的小程序状态管理实现
Jun 14 Javascript
vue中控制mock在开发环境使用,在生产环境禁用方式
Apr 06 Vue.js
vue里使用create, mounted调用方法
Apr 26 Vue.js
$()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
怎样辨别一杯好咖啡
2021/03/03 新手入门
header()函数使用说明
2006/11/23 PHP
PHPMYADMIN 简明安装教程 推荐
2010/03/07 PHP
php实现的一个简单json rpc框架实例
2015/03/30 PHP
PHP curl伪造IP地址和header信息代码实例
2015/04/27 PHP
基于php流程控制语句和循环控制语句(讲解)
2017/10/23 PHP
写了一个layout,拖动条连贯,内容区可为iframe
2007/08/19 Javascript
ExtJS 设置级联菜单的默认值
2010/06/13 Javascript
基于jquery的loading效果实现代码
2010/11/05 Javascript
js 延迟加载 改变JS的位置加快网页加载速度
2012/12/11 Javascript
js操作checkbox遇到的问题解决
2013/06/29 Javascript
JQuery实现表格动态增加行并对新行添加事件
2014/07/30 Javascript
Javascript函数式编程简单介绍
2015/10/11 Javascript
JavaScript转换与解析JSON方法实例详解
2015/11/24 Javascript
js实现n秒倒计时后才可以点击的效果
2015/12/20 Javascript
AngularJS中使用HTML5手机摄像头拍照
2016/02/22 Javascript
js学习笔记之事件处理模型
2016/10/31 Javascript
详解ES6 系列之异步处理实战
2018/10/26 Javascript
[01:02:00]DOTA2-DPC中国联赛 正赛 Elephant vs IG BO3 第三场 1月24日
2021/03/11 DOTA
Python常见格式化字符串方法小结【百分号与format方法】
2016/09/18 Python
名片管理系统python版
2018/01/11 Python
Python 元类实例解析
2018/04/04 Python
Python3 单行多行万能正则匹配方法
2019/01/07 Python
对Python中class和instance以及self的用法详解
2019/06/26 Python
django实现类似触发器的功能
2019/11/15 Python
多视角3D可旋转的HTML5 Logo动画
2016/03/02 HTML / CSS
英语系毕业生自荐信
2013/10/31 职场文书
高一学生评语大全
2014/04/25 职场文书
高校教师个人工作总结2014
2014/12/17 职场文书
春季运动会开幕词
2015/01/28 职场文书
销售工作决心书
2015/02/04 职场文书
办公室规章制度范本
2015/08/04 职场文书
爱岗敬业先进典型事迹材料(2016推荐版)
2016/02/26 职场文书
小学记事作文之200字
2019/08/06 职场文书
Python实战之实现简易的学生选课系统
2021/05/25 Python
PyTorch中permute的使用方法
2022/04/26 Python