<HTML><HEAD><TITLE>outlook菜单</TITLE><META http-equiv=content-type content=text/html;charset=gb2312>
<style>
.outlook-title
{
border:1px outset; background-color:buttonface; color:black; text-align:center; cursor:hand; font-size:9pt;
}.outlook-item{ padding:2px; font-size:9pt;}a.outlook-item:hover{ color:blue;
}</style></HEAD><BODY style="MARGIN: 0px" text=black vLink=white aLink=white link=white scroll=no><table height="100%" width="100%" border=0 cellpadding=0 cellspacing=0> <tr><td width="140"> <TABLE style="WIDTH: 140px; HEIGHT: 100%" cellSpacing=0 cellPadding=0 bgColor=#aca899 border=1 hspace="0" vspace="0"> <TR> <TD id=outLookBarShow style="HEIGHT: 100%" align=middle name="outLookBarShow"> <div id="o1" style="height:100%;"></div> </td> </tr> </table> </td><td><iframe id="frm" name="frm" width="100%" height="100%" frameborder=0></iframe></td></tr></table><SCRIPT LANGUAGE="JavaScript"><!--/**//* ** ================================================================================================== ** 类名：CLASS_OUTLOOKBAR ** 功能：OUTLOOK菜单 ** 示例： --------------------------------------------------------------------------------------------------- var o = new CLASS_OUTLOOKBAR(); o.addTitle("工作安排"); o.addTitle("通告信息"); o.addTitle("管理制度"); o.addTitle("系统管理"); o.addItem(0,"今日安排","frm","http://www.google.com"); o.addItem(0,"工作任务","frm","http://baidu.com"); o.addItem(1,"报社通知","frm","http://www.itpub.net/forum6.html",null); o.setupById("o1"); //定义需要安装的DIV <div id="o1" style="height:100%;"></div> --------------------------------------------------------------------------------------------------- ** 作者：ttyp ** 邮件：ttyp@21cn.com ** 日期：2005-12-1 ** 版本：0.2** ================================================================================================== */function CLASS_OUTLOOKBAR(id,name){ var THIS1 = this; this.id = getUnique(id); this.name = getUnique(name); this.width = "140"; this.height = "100%"; this.titles = new Array(); function getUnique(p){ if(p!=null){ return p; } else { return "outlook_" + new Date().getTime() + "_"; } } this.addTitle = function(name){ function title(name){ var THIS2 = this; this.name = name; this.items = new Array(); this.addItem = function(name,target,url,image,align){ function item(name,target,url,image,align){ this.name = name; this.image = image; this.target = target; this.url = url; this.align = align; } var _item = new item(name,target,url,image,align); THIS2.items[THIS2.items.length] = _item; return _item; } } var _title = new title(name); this.titles[this.titles.length] = _title; return _title; } this.step = 4; this.speed = 10; this.selectedIndex = 0; this.timer = 0; this.rate = 100; this.run = false; this.wait = new Array(); this.select = function(index){ if(this.selectedIndex!=index){ if(this.run==false){ this.rate = 100; this.run = true; this.timer = window.setInterval(function(){ THIS1.rate-= THIS1.step; var oldI = document.getElementById(THIS1.id + THIS1.selectedIndex).nextSibling; var newI = document.getElementById(THIS1.id + index).nextSibling; var ooI = oldI.childNodes[0].childNodes[0]; var nnI = newI.childNodes[0].childNodes[0]; oldI.style.display = ""; newI.style.display = ""; if(THIS1.rate<0){ window.clearInterval(THIS1.timer); THIS1.timer = 0; ooI.style.overflow="auto"; nnI.style.overflow = "auto"; oldI.style.display = "none"; THIS1.run = false; THIS1.selectedIndex = index; if(THIS1.wait.length>0){ THIS1.select(THIS1.wait[0]); THIS1.wait = THIS1.wait.slice(1,-1); } } else { ooI.style.overflow = "hidden"; nnI.style.overflow = "hidden"; oldI.style.height = THIS1.rate +"%"; newI.style.height = (100 - THIS1.rate) + "%"; } },this.speed); }else{ this.wait[this.wait.length] = index; } } } this.setup = function(contain){ if(contain!=null){ var table = document.createElement("table"); table.style.width = "100%"; table.style.height = "100%"; table.cellPadding = "0px"; table.cellSpacing = "0px"; table.style.border = "0px solid red"; table.bgColor = "#aca899"; function getItem(width,height,display,title){ var tris = document.createElement("tr"); var tdis = document.createElement("td"); tdis.style.width = width; tris.style.height = height; tris.style.display = display; tdis.className = "outlook-item"; tdis.style.verticalAlign = "top"; if(title!=null&&typeof(title.items)!="undefined"){ var vv = document.createElement("div"); vv.style.overflow = "auto"; vv.style.height = "100%"; vv.style.width = "100%"; for(var i=0;i<title.items.length;i++){ var div = document.createElement("div"); div.style.textAlign = "center"; div.style.height = "24px"; div.style.paddingTop = "4px"; if(title.items[i].image!=null){ var img = document.createElement("img"); img.src = title.items[i].image; div.appendChild(img); if(typeof(title.items[i].align)!="undefined"&&title.items[i].align==1){ var lbl = document.createElement("label"); lbl.innerHTML = "<br>"; div.appendChild(lbl); } } var a = document.createElement("a"); a.target = title.items[i].target; a.innerHTML = title.items[i].name; a.href = title.items[i].url; div.appendChild(a); vv.appendChild(div); } tdis.appendChild(vv); } tris.appendChild(tdis); return tris; } for(var i=0;i<this.titles.length;i++){ var tr = document.createElement("tr"); var td = document.createElement("td"); tr.style.height = "25px"; td.style.width = "100%"; td.className = "outlook-title"; td.innerHTML = this.titles[i].name; tr.id = this.id + i; tr.appendChild(td); table.appendChild(tr); if (i==this.selectedIndex){ var tris = getItem("100%","100%","",this.titles[i]); table.appendChild(tris); } else { var tri = getItem("100%","0%","none",this.titles[i]); table.appendChild(tri); } } if(typeof(contain.outerHTML)=="undefined"){ contain.appendChild(table); } else { contain.innerHTML = table.outerHTML; } //bind event for(var i=0;i<this.titles.length;i++){ var title = document.getElementById(this.id + i); if(title){ function mapping(index){ try { title.onclick = function(){THIS1.select(index);} title.oncontextmenu = function(){ return false;} title.nextSibling.oncontextmenu = function(){return false;} } catch (e){ } } mapping(i); } } } } this.addItem = function(index,name,target,url,image,align){ if(index>=0&&index<this.titles.length){ return this.titles[index].addItem(name,target,url,image,align); } } this.setupById = function(id){ var d = document.getElementById(id); if(d){ this.setup(d); } }}var o = new CLASS_OUTLOOKBAR(); o.addTitle("工作安排"); o.addTitle("通告信息"); o.addTitle("管理制度"); o.addTitle("系统管理"); o.addItem(0,"今日安排","frm","http://www.google.com"); o.addItem(0,"工作任务","frm","http://baidu.com"); o.addItem(1,"报社通知","frm","http://www.itpub.net/forum6.html",null); o.setupById("o1");//--></SCRIPT></BODY></HTML>OUTLOOK菜单，在IE6.0.FIREFOX1.0下测试通过