javascript jQuery 菜单代码

最新推荐文章于 2020-03-07 17:09:43 发布
最新推荐文章于 2020-03-07 17:09:43 发布
阅读量698 收藏
点赞数

<!DOCTYPE html>
<head></head>
<body>
<SCRIPT language=jscript>
var mmenus   
= new Array();
var misShow  
= new Boolean(); 
misShow=false; 
var misdown  
= new Boolean();
misdown=false;
var msrcel; 
var mfromel;  
var mtoel;  
var musestatus=false;
var mthestatus="";
var mpopTimer = 0; 
mmenucolor='#009AFF';mfontcolor='#FFFFFF';mmenuoutcolor='#009AFF';
mmenuincolor='#009AFF';mmenuoutbordercolor='#009AFF';mmenuinbordercolor='#009AFF';
mmidoutcolor='#0099FF';mmidincolor='#0099FF';mmenuovercolor='#FF0000';mitemedge='0';
msubedge='1';mmenuunitwidth=60;mmenuitemwidth=160;mmenuheight=22;mmenuwidth='500';
mmenuadjust=10;mmenuadjustV=0;mfonts='font-family: 宋体; font-size: 9pt; color: #FFFFFF; ';mcursor='default';
function stoperror(){
return true;
} 
window.οnerrοr=stoperror;
function mpopOut() { 
mpopTimer = setTimeout('mallhide()', 500);
} 
function getReal(el, type, value) {
 temp = el; 
 while ((temp != null) && (temp.tagName != "BODY")) {
  if (eval("temp." + type) == value) {
   el = temp;
   return el;
  } 
  temp = temp.parentElement;
 } 
 return el;
}
 
function mMenuRegister(menu) 
{ 
 
mmenus[mmenus.length] = menu
 
return (mmenus.length - 1)
} 
function  mMenuItem(caption,command,target,isline,statustxt,img,sizex,sizey,pos){ 
 this.caption=caption; 
 this.command=command;
 this.target=target;
 this.isline=isline; 
 this.statustxt=statustxt;
 this.img=img;
 this.sizex=sizex;
 this.sizey=sizey;
 this.pos=pos;
} 
function mMenu(caption,command,target,img,sizex,sizey,pos){
 this.items = new Array();
 this.caption=caption; 
 this.command=command;
 this.target=target;
 this.img=img;
 this.sizex=sizex;
 this.sizey=sizey;
 this.pos=pos; 
 this.id=mMenuRegister(this);
} 
function mMenuAddItem(item)
{ 
 
this.items[this.items.length] = item
 
item.parent = this.id;
 
this.children=true;
} 
mMenu.prototype.addItem = mMenuAddItem;
function mtoout(src){ 
src.style.borderLeftColor=mmenuoutbordercolor;
src.style.borderRightColor=mmenuinbordercolor;
src.style.borderTopColor=mmenuoutbordercolor;
src.style.borderBottomColor=mmenuinbordercolor;
src.style.backgroundColor=mmenuoutcolor;
src.style.color=mmenuovercolor;
} 
function mtoin(src){ 
src.style.borderLeftColor=mmenuinbordercolor;
src.style.borderRightColor=mmenuoutbordercolor;
src.style.borderTopColor=mmenuinbordercolor; 
src.style.borderBottomColor=mmenuoutbordercolor;
src.style.backgroundColor=mmenuincolor;
src.style.color=mmenuovercolor;
} 
function mnochange(src){ 
src.style.borderLeftColor=mmenucolor;
src.style.borderRightColor=mmenucolor;
src.style.borderTopColor=mmenucolor;
src.style.borderBottomColor=mmenucolor;
src.style.backgroundColor='';
src.style.color=mfontcolor;
} 
function mallhide(){ 
 for(var nummenu=0;nummenu<mmenus.length;nummenu++){
  var themenu=document.all['mMenu'+nummenu] 
  var themenudiv=document.all['mmenudiv'+nummenu]
               
mnochange(themenu);
               
mmenuhide(themenudiv);
               
}
} 
function mmenuhide(menuid){ 
menuid.style.filter='Alpha(Opacity=100)';
menuid.style.visibility='hidden';
misShow=false;
} 
function mmenushow(menuid,pid){ 
menuid.style.filter='Alpha(Opacity=80)'; 
menuid.style.left=mposflag.offsetLeft+pid.offsetLeft+mmenuadjust;menuid.style.top=mposflag.offsetTop+mmenutable.offsetHeight+mmenuadjustV+1; 
if(mmenuitemwidth+parseInt(menuid.style.left)>document.body.clientWidth) 
menuid.style.left=document.body.clientWidth-mmenuitemwidth;
menuid.style.visibility='visible';
misShow=true;
} 
function mmenu_over(menuid,x){ 
mtoel = getReal(window.event.toElement, "className", "coolButton");
mfromel
=
getReal(window.event.fromElement,
"className",
"coolButton"); 
if (mtoel == mfromel) return; 
msrcel = window.event.srcElement;
if(x<0){ 
 
misShow = false;
 
mallhide(); 
 
mtoout(msrcel);
}else{ 
 
mallhide();
 
mtoin(msrcel); 
 
mmenushow(menuid,eval("mMenu"+x));
} 
clearTimeout(mpopTimer);
} 
function mmenu_out(menuid){ 
mtoel = getReal(window.event.toElement, "className", "coolButton");
mfromel
=
getReal(window.event.fromElement,
"className",
"coolButton"); 
if (mtoel == mfromel) return;  
msrcel = window.event.srcElement;
if (misShow){
mtoin(msrcel);
}else{ 
mnochange(msrcel);
} 
mpopOut()
} 
function mmenu_down(menuid,x){
msrcel
=
getReal(window.event.srcElement,
"className",
"coolButton");
 
if(misShow){ 
 
mmenuhide(menuid);
 
mtoout(msrcel);
 
} 
 
else{ 
 
mtoin(msrcel); 
 
mmenushow(menuid,eval("mMenu"+x));
 
misdown=true;
 
}
} 
function mmenu_up(){
 
misdown=false;
} 
function mmenuitem_over(menuid){ 
msrcel
=
getReal(window.event.srcElement,
"className",
"coolButton");
if(misdown){
 mtoin(msrcel);
}
else{ 
mtoout(msrcel);
} 
if(mthestatus!=""){
 musestatus=true; 
 window.status=mthestatus;
} 
clearTimeout(mpopTimer);
} 
function mmenuitem_out(menuid){
msrcel
=
getReal(window.event.srcElement,
"className",
"coolButton"); 
mnochange(msrcel); 
if(musestatus)window.status="";
mpopOut()
} 
function mmenuitem_down(menuid){
msrcel
=
getReal(window.event.srcElement,
"className",
"coolButton");
mtoin(msrcel)
misdown=true;
} 
function mmenuitem_up(menuid){
msrcel
=
getReal(window.event.srcElement,
"className",
"coolButton");
mtoout(msrcel)
misdown=false;
} 
function mexec2(x){
var cmd; 
if(mmenus[x].target=="blank"){ 
 
cmd = "window.open('"+mmenus[x].command+"')";
}else{ 
 
cmd = mmenus[x].target+".location='"+mmenus[x].command+"'";
} 
eval(cmd);
} 
function mexec(x,i){
var cmd;
if(mmenus[x].items[i].target=="blank"){
cmd = "window.open('"+mmenus[x].items[i].command+"')";
}else{
cmd = mmenus[x].items[i].target+".location='"+mmenus[x].items[i].command+"'";
} 
eval(cmd);
} 
function mbody_click(){
if (misShow){
 msrcel = getReal(window.event.srcElement, "className", "coolButton"); 
 for(var x=0;x<=mmenus.length;x++){
  if(msrcel.id=="mMenu"+x)
  return;
 } 
 mallhide(); }
}
document.οnclick=mbody_click;
var mMenuBodyRef; 
function mwritetodocument(){
var mwb=1; 
for(var i in document.all){ 
if (document.all[i].tagName == 'BODY'){
mMenuBodyRef = document.all[i]
var stringx='<div id="mposflag" style="position:absolute;"></div><table  id=mmenutable border=0 cellpadding=0 cellspacing=2 width='+mmenuwidth+' height='+mmenuheight+' bgcolor='+mmenucolor+' onselectstart="event.returnValue=false"'+' style="filter:Alpha(Opacity=80);cursor:'+mcursor+';'+mfonts+' border-left: '+mwb+'px solid '+mmenuoutbordercolor+';'+' border-right: '+mwb+'px solid '+mmenuinbordercolor+'; '+'border-top: '+mwb+'px solid '+mmenuoutbordercolor+'; '+'border-bottom: '+mwb+'px solid '+mmenuinbordercolor+'; padding:0px"><tr>'
for(var x=0;x<mmenus.length;x++){
 var thismenu=mmenus[x];
 var imgsize; 
if(thismenu.sizex=="0"&&thismenu.sizey=="0"){
imgsize="";
}else{ imgsize=" width="+thismenu.sizex+" height="+thismenu.sizey; } 
 var ifspace; 
if(thismenu.caption==""){ ifspace="";
 }else{  ifspace=" "; }                      
 stringx += "<td class=coolButton id=mMenu"+x+" style='border: "+mitemedge+"px solid "+mmenucolor+ "' width="+mmenuunitwidth+"px οnmοuseοver=mmenu_over(mmenudiv"+x+   ","+x+") οnmοuseοut=mmenu_out(mmenudiv"+x+ ") οnmοusedοwn=mmenu_down(mmenudiv"+x+","+x+")";
if(thismenu.command!=""){
stringx += " οnmοuseup=mexec2("+x+");mmenu_up();";
}else{
stringx += " οnmοuseup=mmenu_up()";
} 
if(thismenu.pos=="0"){
stringx += " align=center><img align=absmiddle src="+thismenu.img+imgsize+">"+ifspace+thismenu.caption+"</td>";  
}else if(thismenu.pos=="1"){
stringx += " align=center>"+thismenu.caption+ifspace+"<img align=absmiddle src="+thismenu.img+imgsize+"></td>";  
}else if(thismenu.pos=="2"){
stringx += " align=center background="+thismenu.img+">"+thismenu.caption+"</td>"; 
}else{
stringx += " align=center>"+thismenu.caption+"</td>";
} 
 stringx += "";
} 
                    
stringx+="<td width=*> </td></tr></table>";
for(var x=0;x<mmenus.length;x++){
 thismenu=mmenus[x];
if(x<0){
stringx+='<div id=mmenudiv'+x+' style="visiable:none"></div>';
}else{ 
stringx+='<div id=mmenudiv'+x+' style="filter:Alpha(Opacity=80);cursor:'+mcursor+';position:absolute;'+ 'width:'+mmenuitemwidth+'px; z-index:'+(x+100); 

if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0"){ 
stringx+=';border-left: 1px solid '+mmidoutcolor+
';border-top: 1px solid '+mmidoutcolor;}stringx+=';border-right: 1px solid '+mmenuinbordercolor+ ';border-bottom: 1px solid '+mmenuinbordercolor+';visibility:hidden"  onselectstart="event.returnValue=false">\n'+   '<table  width="100%" border="0" height="100%" align="center" cellpadding="0" cellspacing="2" '+  'style="'+mfonts+' border-left: 1px solid '+mmenuoutbordercolor; 
if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0"){ 
 stringx+=';border-right: 1px solid '+mmidincolor+';border-bottom: 1px solid '+mmidincolor;}  stringx+=';border-top: 1px solid '+mmenuoutbordercolor+';padding: 4px" bgcolor='+mmenucolor+'>\n'
 for(var i=0;i<thismenu.items.length;i++){
  var thismenuitem=thismenu.items[i];
  var imgsize; 
if(thismenuitem.sizex=="0"&&thismenuitem.sizey=="0"){ 
imgsize=""
}else{ 
imgsize=" width="+thismenuitem.sizex+" height="+thismenuitem.sizey
} 
var ifspace; 
if(thismenu.caption==""){
ifspace="";
}else{ 
ifspace=" ";
} 
if(!thismenuitem.isline){ 
  stringx += "<tr><td class=coolButton style='border: "+mitemedge+"px solid "+mmenucolor+ "' width=100% height=15px οnmοuseοver=\"mthestatus='"+thismenuitem.statustxt+"';mmenuitem_over(mmenudiv"+x+");\" οnmοuseοut=mmenuitem_out(mmenudiv"+x+") οnmοusedοwn=mmenuitem_down(mmenudiv"+x+") οnmοuseup=";stringx += "mexec("+x+","+i+");mmenuitem_up(mmenudiv"+x+") "; 
 if(thismenuitem.pos=="0"){
 stringx += "><img align=absmiddle src="+thismenuitem.img+imgsize+">"+ifspace+thismenuitem.caption+"</td></tr>";  
 }else if(thismenuitem.pos=="1"){
 stringx += ">"+thismenuitem.caption+ifspace+"<img align=absmiddle src="+thismenuitem.img+imgsize+"></td></tr>"; 
 }else if(thismenuitem.pos=="2"){
 stringx += "background="+thismenuitem.img+">"+thismenuitem.caption+"</td></tr>";  
 }else{
 stringx += ">"+thismenuitem.caption+"</td></tr>";
 }
}else{
  stringx+='<tr><td height="1" background="hr.gif"><img border="0" src="none.gif" width="1" height="1"></td></tr>\n';
} 
}stringx+='</table>\n</div>'
}
}
document.write("<div align='left'>"+stringx+"</div>");
break
}
}
}
 
function document_load(){
 mwritetodocument();  
}
mpmenu1=new mMenu('文件','','self','','','',''); 
mpmenu1.addItem(new mMenuItem('新建','javascript:alert("新建")','self',false,'新建','','','','')); 
mpmenu1.addItem(new mMenuItem('打开','javascript:alert("打开")','self',false,'打开','','','','')); 
mpmenu1.addItem(new mMenuItem('保存','javascript:alert("保存")','self',false,'保存','','','','')); 
mpmenu1.addItem(new mMenuItem(null,null,null,true)); 
mpmenu1.addItem(new mMenuItem('退出','javascript:alert("退出")','self',false,'退出','','','','')); 
mpmenu2=new mMenu('编辑','','self','','','',''); 
mpmenu2.addItem(new mMenuItem('撤销','javascript:alert("撤销")','self',false,'撤销','','','','')); 
mpmenu2.addItem(new mMenuItem('重做','javascript:alert("重做")','self',false,'重做','','','','')); 
mpmenu2.addItem(new mMenuItem(null,null,null,true)); 
mpmenu2.addItem(new mMenuItem('拷贝','javascript:alert("拷贝")','self',false,'拷贝','','','','')); 
mpmenu2.addItem(new mMenuItem('粘贴','javascript:alert("粘贴")','self',false,'粘贴','','','','')); 
mpmenu3=new mMenu('收藏','','self','','','','');
mpmenu3.addItem(new mMenuItem('我的主页','http://www.xxx.com','blank',false,'访问我的主页','','','',''));
mpmenu3.addItem(new  mMenuItem('Yahoo','http://www.yahoo.com','blank',false,'访问Yahoo','','','','')); 
mpmenu4=new mMenu('帮助','','self','','','',''); 
mpmenu4.addItem(new mMenuItem('内容','javascript:alert("内容")','self',false,'内容','','','',''));
mpmenu4.addItem(new mMenuItem('给我写email','mailto:xxxxxxxx','self',false,'给我写email','','','','')); 
mpmenu4.addItem(new mMenuItem(null,null,null,true)); 
mpmenu4.addItem(new mMenuItem('关于','javascript:alert("关于")','self',false,'关于这个软件','','','',''));
</SCRIPT>
<SCRIPT>document_load()</SCRIPT>
</body>

科罗
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery下拉菜单的实现代码
11-26
今天我给大家介绍jquery下拉菜单的实现代码，具体代码如下所述： <!DOCTYPE html> <head lang=”en”> <meta charset=”UTF-8″> * { padding: 0; margin: 0; ul { list-style: none; .wrap { width...
JavaScript简单下拉菜单实例代码
01-21
这是一款JavaScript实现的下拉菜单演示代码，带渐变效果的CSS+jQuery菜单，向下滑出型的菜单，最高支持两级，网上常见到的一种菜单风格，希望大家喜欢哦。 运行效果截图如下： 在线演示地址如下： ...
jQuery点击鼠标和松开鼠标事件
weixin_44831306的博客
03-07 2999
<div onmousedown="mDown(this)" onmouseup="mUp(this)" style="background-color:deeppink;width:90px;height:20px;padding:40px;"></div> 引入：<script src="jquery.min.js"></script> jQ...
jQuery-通过监控mousedown事件，输入框即时展示查询结果面板，获取焦点和失去焦点时，面板展示与否操作
LzzMandy的博客
08-08 391
功能介绍： 1、开始时，面板是隐藏的； 2、输入框获取焦点，面板展示； 3、当点击到面板内区域时，面板不消失；当点击到面板内黄色区域时，面板消失； 4、当点击到面板外区域时，面板消失； 5、当再次点击到输入框时，面板也不消失； 本文只介绍面板展示与消失的操作，查询匹配不做介绍。 可以监听元素的body的mousedown，也可以监听window，如window.onmousedo...
jQuery 事件
weixin_30879169的博客
07-30 128
2010年12月19日 jquery 事件机制【转】 在介绍方法之前，我觉得有必要描述一下响应事件的两种策略，一种是事件捕获(Event capturing)，一种是事件冒泡(Event bubble)，这两种策略是相对立的，它们是在浏览器大战中分别由Netscape和微软提出的完全相反的两种事件传播模型。事件冒泡定义为在一个对象上触发某类事件（比如单击onclick事件），如果此对象定义...
常用jquery
不要轻视行动的力量
04-01 3821
-----取值 $(':input[name="uid"] $("#id") ------表格js table.rows[j].cells[2].innerHTML table.rows[j].style.cssText = "background-color:#33FFFF;color:#CC0000"; trobj.style.cssText = "background-c
jQuery实现动态切换
weixin_33716941的博客
02-27 306
2019独角兽企业重金招聘Python工程师标准>>> ...
手机端jQuery响应式菜单栏代码
05-19
手机端jQuery响应式菜单栏代码，把浏览器宽度调整到480像素查看效果，点击菜单右上角展开菜单。适用于手机浏览器。
jQuery鼠标右键点击菜单代码.zip
06-07
jQuery鼠标右键点击菜单代码.zip
jquery metro拖动菜单代码.zip
11-19
jquery metro拖动菜单代码.zip
document 文挡对象 - JavaScript脚本语言描述
guang_ge的专栏
04-22 1208
document 文挡对象 - JavaScript脚本语言描述———————————————————————注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写否则会提示你一个错误信息 “引用的元素为空或者不是对象/////”———————————————————————对象属性document.title //设置文档标题等价于HTML的title标签docum
jquery事件之鼠标事件
u010865136的专栏
02-27 1457
鼠标事件是在用户移动鼠标光标或者使用任意鼠标键点击时触发的。    (1):click事件：click事件于用户在元素敲击鼠标左键，并在相同元素上松开左键时触发。         $('p').click(function(){                 alert('click function is running !');               });     (2):
HTML/JQuery/CSS实现滚动公告特效组件(可配置)
小龙哒的博客
05-13 1551
文章目录1 需求2 js插件 1 需求 需求是需要在几个页面上去滚动，可经过后端可配置 2 js插件 本人自己写了个插件，首先先在页面上去创建一个div和引入一个js <div id="main"></div> <script src="js/welcom.js"></script> js插件内容 $(function(){ //获取首次url...
JavaScript中mouseover和mouseout多次触发解决办法
热门推荐
hsd2012的专栏
06-12 2万+
mouseover和mouseout多次触发原理分析；mouseenter与mouseleave实现分析；判断两个元素是否存在包含关系；compareDocumentPosition介绍；获取兼容性性的relatedTarget；改进mouseover和mouseout使其具备mouseenter与mouseleave效果效果；对改写的代码进行封装等。
jQuery实现spliter效果
塵风的blog
08-20 825
jQuery实现spliter效果 [code="java"] jQuery splitter demo html, body{ height:100%;width:100%; margin:0;padding:0;overflow: hidden; } #header{background:#c4dcfb;height:5%;}/* Header ...
仿写一个简单的jQuery（学习笔记）
Night_Emperor的博客
10-23 707
jQuery学习笔记： function myAddEvent(obj, sEv, fn) { if(obj.attachEvent) { obj.attachEvent('on'+sEv, function (){ if(false==fn.call(obj)) { event.cancelBubble=true; return false; }
简历模板-前端开发简历模板
最新发布
05-24
简历模板
计算机专业毕业设计范例424篇jsp17529零食小吃食品购物销售网站 ssh mysql 录像.rar
05-24
博主给大家详细整理了计算机毕业设计最新项目,对项目有任何疑问(部署跟文档),都可以问博主哦~ 一、JavaWeb管理系统毕设项目【计算机毕设选题】计算机毕业设计选题，500个热门选题推荐,更多作品展示 计算机毕业设计|PHP毕业设计|JSP毕业程序设计|Android毕业设计|Python设计论文|微信小程序设计
jquery折叠菜单
05-26
1. 为了避免与其他JavaScript库冲突，建议将jQuery代码包裹在一个自执行的匿名函数中。 2. 点击菜单项时，使用e.preventDefault()阻止默认的链接跳转行为。 3. 可以使用CSS样式为菜单项添加图标或其它装饰效果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值