不知道现在有没有用javascript实现工具条?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<STYLE type=text/css>#menubar {
BACKGROUND: rgb(212,208,200); FONT: menu; CURSOR: default; POSITION: relative
}
#menubar .root {
BORDER-RIGHT: rgb(212,208,200) 1px solid; PADDING-RIGHT: 2pt; BORDER-TOP: rgb(212,208,200) 1px solid; PADDING-LEFT: 2pt; BORDER-LEFT: rgb(212,208,200) 1px solid; BORDER-BOTTOM: rgb(212,208,200) 1px solid
}
#menubar TABLE {
BORDER-RIGHT: gray 2px solid; PADDING-RIGHT: 0pt; BORDER-TOP: #eeeeee 2px solid; DISPLAY: none; PADDING-LEFT: 0pt; BACKGROUND: rgb(212,208,200); PADDING-BOTTOM: 0pt; MARGIN: 0pt; FONT: menu; BORDER-LEFT: #eeeeee 2px solid; PADDING-TOP: 0pt; BORDER-BOTTOM: gray 2px solid; POSITION: absolute
}
#menubar TABLE TD {
PADDING-RIGHT: 15pt; PADDING-LEFT: 12pt; PADDING-BOTTOM: 2pt; MARGIN: 0pt; PADDING-TOP: 2pt
}
#menubar .highlight {
BACKGROUND: #08246B; COLOR: white;
}
#menubar .disabledhighlight {
BACKGROUND: rgb(212,208,200); COLOR: gray
}
#menubar #break {
COLOR: gray
}
#menubar .disabled {
COLOR: gray
}
#menubar #break {
PADDING-RIGHT: 0pt; PADDING-LEFT: 0pt; PADDING-BOTTOM: 0pt; MARGIN: 0pt; PADDING-TOP: 0pt
}
#menubar SPAN.more {
PADDING-RIGHT: 0pt; PADDING-LEFT: 0pt; LEFT: 14pt; FLOAT: right; PADDING-BOTTOM: 0pt; MARGIN: 0pt; FONT: 9pt webdings; WIDTH: 0.8em; PADDING-TOP: 0pt; POSITION: relative; TOP: -2pt; HEIGHT: 9pt
}
#menubar .TBHandle {
    BACKGROUND-COLOR: menu;
    BORDER-LEFT: buttonhighlight 1px solid;
    BORDER-RIGHT: buttonshadow 1px solid;
    BORDER-TOP: buttonhighlight 1px solid;
    FONT-SIZE: 1px;
    HEIGHT: 22px;
    POSITION: absolute;
    TOP: 1px;
    WIDTH: 3px
}
#menubar .yToolbar {
    BACKGROUND-COLOR: menu;
    BORDER-BOTTOM: buttonshadow 1px solid;
    BORDER-LEFT: buttonhighlight 1px solid;
    BORDER-RIGHT: buttonshadow 1px solid;
    BORDER-TOP: buttonhighlight 1px solid;
    HEIGHT: 27px;
    LEFT: 0px;
    POSITION: relative;
    TOP: 0px;    
}
.handbtn {
BACKGROUND: buttonface; BORDER-BOTTOM: buttonshadow 1px solid; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 1px solid; BORDER-TOP: buttonhighlight 1px solid; HEIGHT: 21px; WIDTH: 3px
}
.sepbtn1 {
BORDER-LEFT: buttonshadow 1px ridge; BORDER-RIGHT: buttonhighlight 1px solid; WIDTH: 2px
}</STYLE>
</HEAD><BODY>
<script language=javascript>//数组名+次序号码//数组内容第一个值为标题//"样式名称","字体颜色","名称","连接","目标窗口"OutBarFolder1=new Array("系统功能","none","default","新建管理人员","add","_blank","none","default","浏览管理人员","none","_blank","none","default","修改管理人员资料","none","_blank","none","default","更改密码","none","_blank","none","default","权限分配","none","none","break","default","<hr>","none","none","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","break","default","<hr>","none","none","none","default","备份数据","none","_top","none","default","恢复数据","none","_top","break","default","<hr>","none","none","none","default","更改个人资料","none","_blank","none","default","更改个人密码","none","_blank","break","default","<hr>","none","none","none","default","退出管理系统","none","_top");OutBarFolder2=new Array("系统功能","none","default","新建管理人员","add","_blank","none","default","浏览管理人员","none","_blank","none","default","修改管理人员资料","none","_blank","none","default","更改密码","none","_blank","none","default","权限分配","none","none","break","default","<hr>","none","none","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","break","default","<hr>","none","none","none","default","备份数据","none","_top","none","default","恢复数据","none","_top","break","default","<hr>","none","none","none","default","更改个人资料","none","_blank","none","default","更改个人密码","none","_blank","break","default","<hr>","none","none","none","default","退出管理系统","none","_top");OutBarFolder3=new Array("系统功能","none","default","新建管理人员","add","_blank","none","default","浏览管理人员","none","_blank","none","default","修改管理人员资料","none","_blank","none","default","更改密码","none","_blank","none","default","权限分配","none","none","break","default","<hr>","none","none","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","none","default","新建管理人员","add","_blank","break","default","<hr>","none","none","none","default","备份数据","none","_top","none","default","恢复数据","none","_top","break","default","<hr>","none","none","none","default","更改个人资料","none","_blank","none","default","更改个人密码","none","_blank","break","default","<hr>","none","none","none","default","退出管理系统","none","_top"); var childActive = null     var menuActive = null    var lastHighlight = null    var active = false       function getReal(el) {      // Find a table cell element in the parent chain */      temp = el      while ((temp!=null) && (temp.tagName!="TABLE") && (temp.className!="root") && (temp.id!="menuBar")) {        if (temp.tagName=="TD")          el = temp        temp = temp.parentElement      }      return el    }    function raiseMenu(el) {      el.style.borderLeft = "1px #08246B solid"      el.style.borderTop = "1px #08246B solid"      el.style.borderRight = "1px #08246B solid"      el.style.borderBottom = "1px #08246B solid"      el.style.background = "#B5BED6"    }    function clearHighlight(el) {      if (el==null) return      el.style.borderRight = "1px lightgrey solid"      el.style.borderBottom = "1px lightgrey solid"      el.style.borderTop = "1px lightgrey solid"      el.style.borderLeft = "1px lightgrey solid"       el.style.background = "rgb(212,208,200)"    }    function sinkMenu(el) {      el.style.borderRight = "1px #EEEEEE solid"      el.style.borderBottom = "1px #EEEEEE solid"      el.style.borderTop = "1px gray solid"      el.style.borderLeft = "1px gray solid"      el.style.background = "rgb(212,208,200)"    }    function menuHandler(menuItem) {      // Write generic menu handlers here!      // Returning true collapses the menu. Returning false does not collapse the menu      return true    }    function getOffsetPos(which,el,tagName) {      var pos = 0 // el["offset" + which]      while (el.tagName!=tagName) {        pos+=el["offset" + which]        el = el.offsetParent      }      return pos     }

解决方案 »

  1.   


        function getRootTable(el) {      el = el.offsetParent      if (el.tagName=="TR")         el = el.offsetParent      return el    }    function getElement(el,tagName) {      while ((el!=null) && (el.tagName!=tagName) )        el = el.parentElement      return el    }    function processClick() {      var el = getReal(event.srcElement)      if ((getRootTable(el).id=="menuBar") && (active)) {                cleanupMenu(menuActive)        clearHighlight(menuActive)        active=false        lastHighlight=null        doHighlight(el)      }      else {        if ((el.className=="root") || (!menuHandler(el)))          doMenuDown(el)        else {          if (el._childItem==null)             el._childItem = getChildren(el)          if (el._childItem!=null)  return;          if ((el.id!="break") && (el.className!="disabled") && (el.className!="disabledhighlight") && (el.className!="clear"))  {            if (menuHandler(el)) {              cleanupMenu(menuActive)              clearHighlight(menuActive)              active=false              lastHighlight=null            }          }        }      }    }    function getChildren(el) {      var tList = el.children.tags("TABLE")      var i = 0      while ((i<tList.length) && (tList[i].tagName!="TABLE"))        i++      if (i==tList.length)        return null      else        return tList[i]    }    function doMenuDown(el) {      if (el._childItem==null)         el._childItem = getChildren(el)      if ((el._childItem!=null) && (el.className!="disabled") && (el.className!="disabledhighlight")) {        // Performance Optimization - Cache child element        ch = el._childItem        if (ch.style.display=="block") {          removeHighlight(ch.active)          return        }        ch.style.display = "block"        if (el.className=="root") {          ch.style.pixelTop = el.offsetHeight + el.offsetTop + 2          ch.style.pixelLeft = el.offsetLeft + 1   if (ch.style.pixelWidth==0)            ch.style.pixelWidth = ch.rows[0].offsetWidth+50          sinkMenu(el)          active = true          menuActive = el        } else {          childActive = el          ch.style.pixelTop = getOffsetPos("Top",el,"TABLE") -3 // el.offsetTop + el.offsetParent.offsetTop - 3          ch.style.pixelLeft = el.offsetLeft + el.offsetWidth   if (ch.style.pixelWidth==0)            ch.style.pixelWidth = ch.offsetWidth+50        }           }    }     function doHighlight(el) {      el = getReal(el)      if ("root"==el.className) {        if ((menuActive!=null) && (menuActive!=el)) {          clearHighlight(menuActive)        }        if (!active) {          raiseMenu(el)        }                  else           sinkMenu(el)        if ((active) && (menuActive!=el)) {          cleanupMenu(menuActive)                    doMenuDown(el)        }        menuActive = el          lastHighlight=null      }      else {        if (childActive!=null)           if (!childActive.contains(el))             closeMenu(childActive, el)            if (("TD"==el.tagName) && ("clear"!=el.className)) {          var ch = getRootTable(el)                   if (ch.active!=null) {            if (ch.active!=el) {              if (ch.active.className=="disabledhighlight")                  ch.active.className="disabled"              else                ch.active.className=""              }            }          ch.active = el          lastHighlight = el          if ((el.className=="disabled") || (el.className=="disabledhighlight") || (el.id=="break"))             el.className = "disabledhighlight"          else {            if (el.id!="break") {              el.className = "highlight"              if (el._childItem==null)                 el._childItem = getChildren(el)              if (el._childItem!=null) {                doMenuDown(el)              }            }            }        }      }    }    function removeHighlight(el) {      if (el!=null)        if ((el.className=="disabled") || (el.className=="disabledhighlight"))            el.className="disabled"        else          el.className=""    }    function cleanupMenu(el) {      if (el==null) return      for (var i = 0; i < el.all.length; i++) {        var item = el.all[i]        if (item.tagName=="TABLE")         item.style.display = ""        removeHighlight(item.active)        item.active=null      }    }    function closeMenu(ch, el) {      var start = ch      while (ch.className!="root") {          ch = ch.parentElement          if (((!ch.contains(el)) && (ch.className!="root"))) {            start=ch          }      }      cleanupMenu(start)    }
      

  2.   


        function checkMenu() {            if (document.all.menuBar==null) return      if ((!document.all.menuBar.contains(event.srcElement)) && (menuActive!=null)) {        clearHighlight(menuActive)        closeMenu(menuActive)        active = false        menuActive=null        choiceActive = null      }    }    function doCheckOut() {      var el = event.toElement            if ((!active) && (menuActive!=null) && (!menuActive.contains(el))) {        clearHighlight(menuActive)        menuActive=null      }    }    function processKey() {      if (active) {        switch (event.keyCode) {         case 13: lastHighlight.click(); break;         case 39:  // right           if ((lastHighlight==null) || (lastHighlight._childItem==null)) {             var idx = menuActive.cellIndex//             if (idx==menuActive.offsetParent.cells.length-2)             if (idx==getElement(menuActive,"TR").cells.length-2)               idx = 0             else               idx++             newItem = getElement(menuActive,"TR").cells[idx]           } else           {             newItem = lastHighlight._childItem.rows[0].cells[0]           }           doHighlight(newItem)           break;          case 37: //left           if ((lastHighlight==null) || (getElement(getRootTable(lastHighlight),"TR").id=="menuBar")) {             var idx = menuActive.cellIndex             if (idx==0)               idx = getElement(menuActive,"TR").cells.length-2             else               idx--             newItem = getElement(menuActive,"TR").cells[idx]           } else           {             newItem = getElement(lastHighlight,"TR")             while (newItem.tagName!="TD")               newItem = newItem.parentElement           }           doHighlight(newItem)           break;          case 40: // down            if (lastHighlight==null) {              itemCell = menuActive._childItem              curCell=0              curRow = 0            }            else {              itemCell = getRootTable(lastHighlight)              if (lastHighlight.cellIndex==getElement(lastHighlight,"TR").cells.length-1) {                curCell = 0                curRow = getElement(lastHighlight,"TR").rowIndex+1                if (getElement(lastHighlight,"TR").rowIndex==itemCell.rows.length-1)                  curRow = 0              } else {                curCell = lastHighlight.cellIndex+1                curRow = getElement(lastHighlight,"TR").rowIndex              }            }            doHighlight(itemCell.rows[curRow].cells[curCell])            break;         case 38: // up            if (lastHighlight==null) {              itemCell = menuActive._childItem              curRow = itemCell.rows.length-1              curCell= itemCell.rows[curRow].cells.length-1            }            else {              itemCell = getRootTable(lastHighlight)              if (lastHighlight.cellIndex==0) {                curRow = getElement(lastHighlight,"TR").rowIndex-1                if (curRow==-1)                  curRow = itemCell.rows.length-1                curCell= itemCell.rows[curRow].cells.length-1              } else {                curCell = lastHighlight.cellIndex - 1                curRow = getElement(lastHighlight,"TR").rowIndex              }            }            doHighlight(itemCell.rows[curRow].cells[curCell])            break;           if (lastHighlight==null) {              curCell = menuActive._childItem              curRow = curCell.rows.length-1            }            else {              curCell = getRootTable(lastHighlight)              if (getElement(lastHighlight,"TR").rowIndex==0)                curRow = curCell.rows.length-1              else                curRow = getElement(lastHighlight,"TR").rowIndex-1            }            doHighlight(curCell.rows[curRow].cells[0])            break;        }      }    }function make_menu() {document.write("<table width='100%' cellpadding='0' cellspacing='0' border='0' style='background=rgb(212,208,200); BACKGROUND: buttonface; BORDER-BOTTOM: buttonshadow 1px solid; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 1px solid; BORDER-TOP: buttonhighlight 1px solid;'>");document.write("<tr><TD><SPAN class=handbtn></SPAN></TD><td>");document.write("<TABLE ID=menuBar ONSELECTSTART='return false' ONCLICK='processClick()' ONMOUSEOVER='doHighlight(event.toElement)' ONMOUSEOUT='doCheckOut()' ONKEYDOWN='processKey()'><TR>"); j=1; while(eval("window.OutBarFolder"+j)) j++; i=1; while(i<j) { Folder=eval("OutBarFolder"+i)        document.write("<TD NOWRAP CLASS=root>"+Folder[0]+"<TABLE CELLSPACING=0 CELLPADDING=0>"); MakeItems(Folder);        document.write("</TABLE>"); i++; }document.write("</TD></TR></TABLE>");document.write("</td><td width=100% ONMOUSEOVER='processClick()'></td></tr></table>");}function MakeItems(Folder){ var items=0; while(Folder[items+1]) items+=5; items/=5; for(var i=1;i<items*5;i+=5) {/* if(Folder[i+1]=="BREAK") { document.write("<TD NOWRAP ID=break><HR></TD>"); } else { document.write("<TR><TD NOWRAP>"+Folder[i+1]+"</TD></TR>"); }*/ document.write("<TR><TD NOWRAP"+((Folder[i+0]=="none")?"":" ID='"+Folder[i+0]+"'")+((Folder[i+3]=="none")?"":" onclick=\"go(1,'"+Folder[i+3]+"')\"")+">"+((Folder[i+1]=="default")?"":"<font color="+Folder[i+1]+">")+Folder[i+2]+((Folder[i+1]=="default")?"":"</font>")+"</TD></TR>");//alert("<TR><TD NOWRAP "+((Folder[i+0]=="none")?"":"ID='"+Folder[i+0]+"'")+((Folder[i+3]=="none")?"":" onclick=go(1,'"+Folder[i+3]+"')")+">"+((Folder[i+1]=="default")?"":"<font color="+Folder[i+1]+">")+Folder[i+2]+((Folder[i+1]=="default")?"":"</font>")+"</TD></TR>"); } }function go(i,iurl) { switch (i)  { case 1 : parent.location=iurl;break; //返回首页 case 2 : top.main.location='login.htm';break;  //登录 case 3 : top.main.location='shenqing.htm';break;  //注册 case 4 : top.main.location='addnew.asp';break;   //增加新贴 case 5 : top.main.location='index1.asp';break;   //第一页 case 6 : //上一页 var obj=top.main var str=obj.location.href; if(str.indexOf("index1")>0) obj.location="index1.asp@page="+obj.document.all("ppage").value; else obj.location="index1.asp"; break;    case 7 : //下一页 var obj=top.main var str=obj.location.href; if(str.indexOf("index1")>0) obj.location="index1.asp@page="+obj.document.all("npage").value; else obj.location="index1.asp"; break;    case 8 :  //最后一页 var obj=top.main var str=obj.location.href; if(str.indexOf("index1")>0) obj.location="index1.asp@page="+obj.document.all("epage").value; else obj.location="index1.asp"; break;    case 9: top.main.location='editinfo.asp';break; case 10: top.main.location='quit.asp';break; case 11: top.main.location='userinfo.asp';break; case 12:  var newwin=top.open("../../../waha.3322.net/default.htm"); newwin.focus(); break; }}make_menu();</script>
     
      <br>
      
    </BODY>
    </HTML>