DooIT@江西搜才网

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::
  51 随笔 :: 17 文章 :: 1151 评论 :: 28 引用

公告

<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下测试通过
posted on 2005-12-25 22:25 ttyp 阅读(...) 评论(...) 编辑 收藏