自由添加菜单,类似易趣的管理页面中的那些小菜单.javascript实现,可跨多种浏览器

[入库:2005年8月18日] [更新:2007年3月25日]

本文简介:选择自 super852 的 blog

类似易趣里"我的易趣"中的那些小的下拉菜单.
用javascirpt 实现,
支持多浏览器,(在ie6和firefox中调试成功)

以下是menu.js中的代码

var arymenu=new array();
var vview;
var vhide;
var menudiv;
if(window.navigator.appname.indexof("icrosoft")>=1){
  vhide="hidden";
  vview="visible";
}
else{
  vhide="hide";
  vview="show";
}
function addmenu(menuid){
  arymenu[menuid]=new array();
}
function addlink(menuid,strlink,strtext){
  addmenuhtml(menuid,strlink,"<a href=\""+strlink+"\">"+strtext+"</a>");
}
function addmenuhtml(menuid,strlink,strhtml){
 arymenu[menuid][strlink]=strhtml;
}
function menuview(menuid,thisevt){
  if(document.all){
    menudiv=document.all["menulayer"];
  }
  else{
    menudiv=document.getelementbyid("menulayer");
  }
  var strhtml="<table width='100%' bgcolor='#ffcc99'>"
  for(var strlink in arymenu[menuid]){
    strhtml=strhtml+"<tr><td>"+arymenu[menuid][strlink]+"</td></tr>";
  }
  strhtml=strhtml+"</table>";
  menudiv.innerhtml=strhtml;
  divview(thisevt);
}
function check_mouse(thisevt){
var cx;
var cy;
var divobj;
if(document.all){
  cx=document.body.scrollleft+window.event.clientx;
  cy=document.body.scrolltop+window.event.clienty;
}
else{
  cx=thisevt.pagex;
  cy=thisevt.pagey;
}
if(cx<menudiv.offsetleft || cx>menudiv.offsetleft+menudiv.offsetwidth || cy<menudiv.offsettop || cy>menudiv.offsettop+menudiv.offsetheight){
    if(menudiv.style){divobj=menudiv.style;vhide="hidden";}else{divobj=menudiv;vhide="hide";}
    divobj.visibility="hidden";
    document.onmousemove=null;
  }
}
function divview(thisevt){
var cx;
var cy;
var divobj;
if(document.all){
  cx=document.body.scrollleft+window.event.clientx-80;
  cy=document.body.scrolltop+window.event.clienty-10;
}
else{
  cx=thisevt.pagex-80;
  cy=thisevt.pagey-10;
}
while(cx<document.body.scrollleft){cx++;}
while(cy<document.body.scrolltop){cy++;}
while(cy>document.body.offsetheight+document.body.scrolltop-menudiv.offsetheight){cy--}
if(menudiv.style){divobj=menudiv.style;vview="visible";}else{divobj=menudiv;vview="show";}
divobj.left=cx;
divobj.top=cy;
divobj.visibility=vview;
document.onmousemove=check_mouse;
}
addmenubtn(menuid){
 document.writeln("<img src=\"/menu.gif\" style=\"cursor:hand\" onclick=\"menuview("+menuid+",event);\">");
}
document.writeln("<div id=\"menulayer\"  style=\"visibility:"+vhide+";border-right: #000000  1px; border-top: #000000 1px; z-index: 1;width:140px; left: 53px; overflow: auto; border-left: #000000 1px;  border-bottom: #000000 1px; position: absolute; top: 70px; background-color: #f5f5f5; layer-background-color: #f5f5f5\"></div>");




在需要使用的网页的<body></body>之间加入<script language=javscript src=menu.js></script>

然后
<script>
addmenu(1098); //添加一个菜单.
addlink(1098,“http://www.baidu.com“,“百度“);//在1098菜单中添加一个链接
addlink(1098,“http://www.sohu.com“,“搜狐“);//在1098菜单中添加一个链接
addlink(1098,“http://www.sina.com.com“,“新浪“);//在1098菜单中添加一个链接
addlink(1098,“http://www.163.com“,“网易“);//在1098菜单中添加一个链接
addlink(1098,“http://www.csdn.net“,“csdn“);//在1098菜单中添加一个链接
addmenubtn(1098);//在当前位置显示一个图片按钮,点击这个安钮时,显示1098这个菜单

</script>

本文关键:自由添加菜单,类似易趣的管理页面中的那些小菜单.javascript实现,可跨多种浏览器
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top