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 相关文章推荐
DOM_window对象属性之--clipboardData对象操作代码
Feb 03 Javascript
JavaScript中为元素加上name属性的方法
May 09 Javascript
JS清除IE浏览器缓存的方法
Jul 26 Javascript
js身份证判断方法支持15位和18位
Mar 18 Javascript
jQuery height()、innerHeight()、outerHeight()函数的区别详解
May 23 Javascript
Bootstrap栅格系统学习笔记
Nov 25 Javascript
浅谈js在html中的加载执行顺序,多个jquery ready执行顺序
Nov 26 Javascript
JS获取填报扩展单元格控件的值的解决办法
Jul 14 Javascript
Vue的elementUI实现自定义主题方法
Feb 23 Javascript
详解js删除数组中的指定元素
Oct 31 Javascript
vue实现信息管理系统
May 30 Javascript
使用vue3重构拼图游戏的实现示例
Jan 25 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
session 的生命周期是多长
2006/10/09 PHP
PHP中include()与require()的区别说明
2010/03/10 PHP
php面向对象 字段的声明与使用
2012/06/14 PHP
PHP调用MsSQL Server 2012存储过程获取多结果集(包含output参数)的详解
2013/07/03 PHP
PHP实现批量生成App各种尺寸Logo
2015/03/19 PHP
php冒泡排序与快速排序实例详解
2015/12/07 PHP
thinkPHP中分页用法实例分析
2015/12/26 PHP
PHP与jquery实时显示网站在线人数实例详解
2016/12/02 PHP
PHP框架Laravel中实现supervisor执行异步进程的方法
2017/06/07 PHP
Yii 2.0实现联表查询加搜索分页的方法示例
2017/08/02 PHP
Thinkphp 在api开发中异常返回依然是html的解决方式
2019/10/16 PHP
javascript document.referrer 用法
2009/04/30 Javascript
可以用鼠标拖动的DIV实现思路及代码
2013/10/21 Javascript
node.js中实现同步操作的3种实现方法
2014/12/05 Javascript
AngularJS中$watch和$timeout的使用示例
2016/09/20 Javascript
使用JS 插件qrcode.js生成二维码功能
2017/02/20 Javascript
Vue 单文件中的数据传递示例
2017/03/21 Javascript
详解VUE 定义全局变量的几种实现方式
2017/06/01 Javascript
超级简易的JS计算器实例讲解(实现加减乘除)
2017/08/08 Javascript
JavaScript中将值转换为字符串的五种方法总结
2019/06/06 Javascript
JavaScript获取当前url路径过程解析
2019/12/27 Javascript
[46:44]VG vs TNC Supermajor小组赛B组败者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
[11:12]2018DOTA2国际邀请赛寻真——绿色长城OpTic
2018/08/10 DOTA
python3.6+django2.0开发一套学员管理系统
2018/03/03 Python
如何在Cloud Studio上执行Python代码?
2019/08/09 Python
python处理写入数据代码讲解
2020/10/22 Python
NYX Professional Makeup英国官网:美国平价专业彩妆品牌
2019/11/13 全球购物
财务会计专业应届毕业生求职信
2013/10/18 职场文书
怎样写留学自荐信
2013/11/11 职场文书
大专生自我评价
2014/01/28 职场文书
党的群众路线对照检查材料范文
2014/09/24 职场文书
英语专业毕业论文答辩开场白
2015/05/27 职场文书
教师实习自我鉴定总结
2019/08/20 职场文书
十二月早安励志心语大全
2019/12/03 职场文书
dubbo集成zipkin获取Traceid的实现
2021/07/26 Java/Android
十大最强电系宝可梦,阿尔宙斯电系之一,第七被称为雷神
2022/03/18 日漫