JAVA涂鸦
关于JAVA的点点滴滴
posts - 50,  comments - 689,  trackbacks - 0
< HTML >< HEAD >
< META  content ="text/html; charset=gb2312"  http-equiv =Content-Type >
< SCRIPT  language =JAVASCRIPT >
    OB_Top
= 0 ;     // 菜单距离顶部的象素值;
    OB_Left = 0 ;     // 菜单距离左侧的象素值;
    OB_Margin = 10 ; // top and bottom margins between icons and borders
    OB_Width = 96 ; // 菜单宽度
    OB_Height = 400 ; // 菜单高度
    OB_SlideSpeed = 1.5 ;             // 菜单运动速度
    OB_BackgroundColor = " BACKGROUND " ;
        
// 背景色
    OB_ItemsSpacing = 25 ;             // 2个图标间的距离
    OB_BorderWidth = 3 ;             // border宽度
    OB_BorderStyle = " ridge " ;         // border风格
    OB_BorderColor = " #dddddd " ;     // border颜色
    OB_IconsWidth = 32 ;             // 图标宽度
    OB_IconsHeight = 32 ;             // 图标高度
    OB_ButtonFontFamily = " arial " ;    
        
// 按钮上字体的字型
    OB_ButtonFontSize = 9 ;         // 按钮上字体大小 
    OB_ButtonFontColor = " black " ;     // 按钮上字体颜色    
    OB_ButtonHeight = 25 ;             // 按钮的高度
    OB_LabelFontFamily = " arial " ;     // LOGO下字体的字型
    OB_LabelFontSize = 9 ;             // LOGO下面的字体大小
    OB_LabelFontColor = " white " ;     // LOGO下的字体颜色
    OB_LabelMargin = 3 ;             // margin between labels and icons
    OB_UpArrow = " arrowup.gif " ;     // 向上滚动的logo箭头    
    OB_DownArrow = " arrowdown.gif " ;        
        
// 向下滚动的logo箭头
    OB_ArrowWidth = 15 ;             // 箭头的宽度
    OB_ArrowHeight = 15 ;             // 箭头的高度
    OB_ArrowSlideSpeed = 10 ;         // 项目列表滚动的速度;
</ SCRIPT >

< SCRIPT  language =JAVASCRIPT >
if  (document.all) {
/* 你需要修改下面的代码,就是菜单左侧的部分,如果页面在右侧的frame打开,用parent.main,其中main是右侧的frame的名字,见下一句。由于这是例子,所以使用了javascript产生警告框,将它们去掉即可。即将下面的javascript::Run(x)全部替换成具体的页面,并且将紧接着的空的双引号中加上parent.main即可。 */
OutBarFolder1
= new  Array(
" 我的好友 " ,
" mail.gif " , " Download It " , " page2.htm " , " parent.top " ,
" chat.gif " , " Chat " , " page2.htm " , " parent.top " ,
" news.gif " , " Newsgroup " , " page2.htm " , " parent.top " ,
" netm.gif " , " Netmeeting " , " page2.htm " , " parent.top "
);
/* 你可以替换相应的LOGO,这里全部的LOGO是32-32的,这个尺寸与menu.html文件中定义的一致。 */
OutBarFolder2
= new  Array(
" Folder 2 " ,
" word.gif " , " Word " , " page2.htm " , " parent.top " ,
" excel.gif " , " Excel " , " page2.htm " , " parent.top " ,
" ppt.gif " , " Powerpoint " , " page2.htm " , " parent.top " ,
" access.gif " , " Access " , " page2.htm " , " parent.top " ,
" peditor.gif " , " Photo Editor " , " page2.htm " , " parent.top "
);
/* 替换上面的javascript:Run(x)为对应的页面,并且在紧接着的双引号中加上打开的frame(parent.main)即可,注意,如果需要整个页面打开,不要使用parent.main,而要用top即可 */
OutBarFolder3
= new  Array(
" Folder 3 " ,
" word.gif " , " Word " , " page2.htm " , " parent.top " ,
" ppt.gif " , " Powerpoint " , " page2.htm " , " parent.top "
);

OutBarFolder4
= new  Array(
" Folder 4 " ,
" mail.gif " , " E-Mail " , " page2.htm " , " parent.top " ,
" chat.gif " , " Chat " , " page2.htm " , " parent.top " ,
" news.gif " , " Newsgroup " , " page2.htm " , " parent.top " ,
" netm.gif " , " Netmeeting " , " page2.htm " , " parent.top " ,
" word.gif " , " Word " , " page2.htm " , " parent.top " ,
" excel.gif " , " Excel " , " page2.htm " , " parent.top " ,
" ppt.gif " , " Powerpoint " , " page2.htm " , " parent.top " ,
" access.gif " , " Access " , " page2.htm " , " parent.top " ,
" peditor.gif " , " Photo Editor " , " page2.htm " , " parent.top "
);

// 例子里有4个菜单按钮,可以增加,但是需要改以下outbar.js中的一些代码,要让程序知道你要处理多少个菜单。内有注释。

document.write(
" <DIV id='OutlookLikeBar' style='position:absolute;top: " + OB_Top + " ;left: " + OB_Left + " ;width: " + OB_Width + " ;height: " + OB_Height + " ;border: " + OB_BorderWidth + "   " + OB_BorderStyle + "   " + OB_BorderColor + " ;background-color: " + OB_BackgroundColor + " ;z-index:0;visibility:hidden;clip:rect(0, " + OB_Width + " , " + OB_Height + " ,0)'> " );
document.write(
" <img onMouseUp='OutlookLikeBar.ArrowSelected(this)' onMouseDown='OutlookLikeBar.ArrowClicked(this)' onMouseOver='OutlookLikeBar.OverArrow(this)' onMouseOut='OutlookLikeBar.OutArrow(this)' id='OB_SlideUp' height=' " + OB_ArrowHeight + " ' width=' " + OB_ArrowWidth + " ' src=' " + OB_UpArrow + " ' style='position:absolute;top:0;left:0;cursor:hand;visibility:hidden;z-index:500'> " );
document.write(
" <img onMouseUp='OutlookLikeBar.ArrowSelected(this)' onMouseDown='OutlookLikeBar.ArrowClicked(this)' onMouseOver='OutlookLikeBar.OverArrow(this)' onMouseOut='OutlookLikeBar.OutArrow(this)' id='OB_SlideDown' height=' " + OB_ArrowHeight + " ' width=' " + OB_ArrowWidth + " ' src=' " + OB_DownArrow + " ' style='position:absolute;top:0;left:0;cursor:hand;visibility:hidden;z-index:500'> " );
j
= 1 ;
while (eval( " window.OutBarFolder " + j))
    j
++ ;
i
= j - 1 ;
while (i > 0 )
{
    Folder
= eval( " OutBarFolder " + i)
    window.status
= " Outlook-Like Bar is making folder ' " + Folder[ 0 ] + " ' " ;
    
if (i == 1 )
    
{
        document.write(
" <INPUT position='UP' id='OB_Button1' onDblClick='OutlookLikeBar.FolderClicked( " + i + " );this.blur()' onClick='OutlookLikeBar.FolderClicked( " + i + " );this.blur()' TYPE='button' value=' " + Folder[ 0 ] + " ' style='position:absolute;top:0;left:0;width:90;height: " + OB_ButtonHeight + " ;font-family: " + OB_ButtonFontFamily + " ;font-size: " + OB_ButtonFontSize + " pt;cursor:hand;color: " + OB_ButtonFontColor + " ;z-index:100'> " );
        MakeItems(Folder,i,OB_ButtonHeight);        
    }
    
    
else
    
{
        document.write(
" <INPUT position='DOWN' id='OB_Button " + i + " ' onDblClick='OutlookLikeBar.FolderClicked( " + i + " );this.blur()' onClick='OutlookLikeBar.FolderClicked( " + i + " );this.blur()' TYPE='button' value=' " + Folder[ 0 ] + " ' style='position:absolute;top: " + (OB_Height - (j - i) * OB_ButtonHeight - OB_BorderWidth * 2 ) + " ;left:0;width:100%;height: " + OB_ButtonHeight + " ;font-family: " + OB_ButtonFontFamily + " ;font-size: " + OB_ButtonFontSize + " pt;cursor:hand;color: " + OB_ButtonFontColor + " ;z-index:100'> " );
        MakeItems(Folder,i,(OB_Height
- (j - i) * OB_ButtonHeight - OB_BorderWidth * 2 ) + OB_ButtonHeight);        
    }
        
    i
-- ;
}
    
document.write(
" </DIV> " );
var  OutlookLikeBar = new  OutBar(OB_Width,OB_Height,j - 1 ,OB_ButtonHeight,OB_BorderWidth,OB_SlideSpeed,OB_IconsHeight + OB_LabelFontSize + OB_LabelMargin + OB_ItemsSpacing,OB_ArrowSlideSpeed);
window.status
= " Outlook-Like Bar successful created! " ;
document.all[
" OutlookLikeBar " ].style.visibility = " visible " ;

/* 以下的代码中你需要改动菜单的数目与实际一致,本例用了4个按钮菜单。 */
function  MakeItems(Folder,zorder,top)
{
    
var  items = 0 ;
    
var  folderWidth = (OB_Width - OB_BorderWidth * 2 );
    
while (Folder[items + 1 ])
        items
+= 4 ;   // 需要改这里及下面的4;
    items /= 4 ;
    document.write(
" <DIV id='OB_Folder " + zorder + " ' style='position:absolute;left:0;top: " + top + " ;width: " + folderWidth + " ;height: " + (OB_Margin * 2 + items * (OB_IconsHeight + OB_LabelFontSize + OB_LabelMargin) + (items - 1 ) * OB_ItemsSpacing) + " ;z-index: " + zorder + " ;clip:rect(0 0 0 0);'> " );
    
for ( var  i = 1 ;i < items * 4 ;i += 4 )
    
{
        document.write(
" <div targetFrame=' " + Folder[i + 3 ] + " ' link=' " + Folder[i + 2 ] + " ' onMouseDown='OutlookLikeBar.ItemClicked(this)' onMouseUp='OutlookLikeBar.ItemSelected(this)' onMouseOver='OutlookLikeBar.OverItems(this)' onMouseOut='OutlookLikeBar.OutItems(this)' style='position:absolute;left: " + (Math.ceil((OB_Width - OB_BorderWidth * 2 - OB_IconsHeight) / 2 ) - 1 ) + " ;top: " + (OB_Margin + Math.ceil((i - 1 ) / 4 ) * (OB_ItemsSpacing + OB_LabelFontSize + OB_IconsHeight)) + " ;cursor:hand;clip:rect(0  " + OB_IconsWidth + "   " + OB_IconsHeight + "  0;width: " + OB_IconsWidth + " ;height: " + OB_IconsHeight + " '> " );
         document.write(
" <img src=' " + Folder[i] + " '> " );
        document.write(
" </div> " );
        document.write(
" <div align='center' style='position:absolute;width:100%;left:0;top: " + (OB_LabelMargin + OB_IconsHeight + OB_Margin + Math.ceil((i - 1 ) / 4 ) * (OB_ItemsSpacing + OB_LabelFontSize + OB_IconsHeight)) + " ;font-family: " + OB_LabelFontFamily + " ;font-size: " + OB_LabelFontSize + " pt;color: " + OB_LabelFontColor + " '> " );
        document.write(Folder[i
+ 1 ]);
        document.write(
" </div> " );
    }
    
    document.write(
" </DIV> " );
}



// ***************************
//
* Outlook-Like Bar Object *
//
***************************
function  OutBar(width,height,items,buttonHeight,borderWidth,slideSpeed,slideArrowValue,ArrowSlideSpeed)
{
    
this .currentFolder = 1 ;
    
this .currentItem = null ;
    
this .slideCount = 0 ;
    
this .slideStep = 1 ;
    
this .slideArrowValue = slideArrowValue;
    
this .slideSpeed = slideSpeed;
    
this .borderWidth = borderWidth;
    
this .width = width;
    
this .visibleAreaHeight = height - 2 * borderWidth - items * buttonHeight;
    
this .visibleAreaWidth = width;
    
this .FolderClicked = FolderClicked;
    
this .SlideFolders = SlideFolders;
    
this .ItemClicked = ItemClicked;
    
this .ItemSelected = ItemSelected;
    
this .OverItems = OverItems;
    
this .OutItems = OutItems;
    
this .OverArrow = OverArrow;
    
this .OutArrow = OutArrow;
    
this .ArrowClicked = ArrowClicked;
    
this .ArrowSelected = ArrowSelected;
    
this .ArrowSlideSpeed = ArrowSlideSpeed;
    
this .SlideItems = SlideItems;
    
this .SlideItemsAction = SlideItemsAction;
    
this .Start = Start;
    
this .ClipFolder = ClipFolder;
    
this .SetArrows = SetArrows;
    
this .HideArrows = HideArrows;
    
this .sliding = false ;
    
this .items = items;
    
this .started = false ;
    
this .Start();
}


function  FolderClicked(folder)
{
    
if ( this .sliding)
        
return ;
    
if (folder == this .currentFolder)
        
return ;
    
this .sliding = true ;        
    
this .slideCount = this .visibleAreaHeight;
    
this .slideStep = 1 ;
    
this .countStep = 0 ;
    
this .HideArrows();
    
this .SlideFolders(folder,document.all[ " OB_Button " + folder].position == " DOWN " );
}


function  SlideFolders(folder,down)
{
    
var  step;    
    
if (down)
    
{
        
this .slideCount -= Math.floor( this .slideStep);
        
if ( this .slideCount < 0 )
            
this .slideStep += this .slideCount;
        step
= Math.floor( this .slideStep);
        
for ( var  i = 2 ;i <= folder;i ++ )
            
if (document.all[ " OB_Button " + i].position == " DOWN " )
            
{
                document.all[
" OB_Button " + i].style.pixelTop -= step;
                document.all[
" OB_Folder " + i].style.pixelTop -= step;
            }
                

        filter 
=   / rect\((\d * )px (\d * )px (\d * )px (\d * )px\) / ;

        
var  clipString = document.all[ " OB_Folder " + folder].style.clip;
        
var  clip = clipString.match(filter);
        
this .ClipFolder(folder,parseInt(clip[ 1 ]), this .visibleAreaWidth,(parseInt(clip[ 3 ]) + step), 0 );

        
var  clipString = document.all[ " OB_Folder " + this .currentFolder].style.clip;
        
var  clip = clipString.match(filter);
        
this .ClipFolder( this .currentFolder,parseInt(clip[ 1 ]), this .visibleAreaWidth,(parseInt(clip[ 3 ]) - step), 0 );

        
this .slideStep *= this .slideSpeed;
        
if ( this .slideCount > 0 )
            setTimeout(
" OutlookLikeBar.SlideFolders( " + folder + " ,true) " , 20 );
        
else         
        
{
            
for ( var  k = 2 ;k <= folder;k ++ )
                document.all[
" OB_Button " + k].position = " UP " ;
            
this .currentFolder = folder;        
            
this .SetArrows();
            
this .sliding = false ;        
        }
        
    }

    
else         
    
{
        
this .slideCount -= Math.floor( this .slideStep);
        
if ( this .slideCount < 0 )
            
this .slideStep += this .slideCount;
        step
= Math.floor( this .slideStep);
        
for ( var  i = folder + 1 ;i <= this .items;i ++ )
            
if (document.all[ " OB_Button " + i].position == " UP " )
            
{
                document.all[
" OB_Button " + i].style.pixelTop += step;
                document.all[
" OB_Folder " + i].style.pixelTop += step;
            }


        filter 
=   / rect\((\d * )px (\d * )px (\d * )px (\d * )px\) / ;

        
var  clipString = document.all[ " OB_Folder " + folder].style.clip;
        
var  clip = clipString.match(filter);
        
this .ClipFolder(folder,parseInt(clip[ 1 ]), this .visibleAreaWidth,(parseInt(clip[ 3 ]) + step), 0 );

        
var  clipString = document.all[ " OB_Folder " + this .currentFolder].style.clip;
        
var  clip = clipString.match(filter);
        
this .ClipFolder( this .currentFolder,parseInt(clip[ 1 ]), this .visibleAreaWidth,(parseInt(clip[ 3 ]) - step), 0 );

        
this .slideStep *= this .slideSpeed;
        
if ( this .slideCount > 0 )
            setTimeout(
" OutlookLikeBar.SlideFolders( " + folder + " ,false) " , 20 );
        
else         
        
{
            
for ( var  k = folder + 1 ;k <= this .items;k ++ )
                document.all[
" OB_Button " + k].position = " DOWN " ;
            
this .currentFolder = folder;        
            
this .SetArrows();
            
this .sliding = false ;        
        }
        
    }

}


function  ItemClicked(item)
{
    
if ( this .sliding)
        
return ;        
    item.style.border
= " 2 inset #ffffff " ;
}


function  ItemSelected(item)
{
    
if ( this .sliding)
        
return ;        
    item.style.border
= " 1 outset #ffffff " ;
    
if (item.link.indexOf( " javascript " ) !=- 1
        eval(item.link)
    
else  
        eval(item.targetFrame
+ " .location=' " + item.link + " ' " );
}


function  OverItems(item)
{
    
if ( this .sliding)
        
return ;        
    item.style.border
= " 1 outset #ffffff " ;
}


function  OutItems(item)
{
    
if ( this .sliding)
        
return ;        
    item.style.border
= " 0 none black " ;
}


function  ArrowClicked(arrow)
{
    
if ( this .sliding)
        
return ;        
    arrow.style.border
= " 1 inset #ffffff " ;
}


function  ArrowSelected(arrow)
{
    
if ( this .sliding)
        
return ;        
    arrow.style.border
= " 0 none black " ;
    
this .SlideItems(arrow.id == " OB_SlideUp " );
}


function  OverArrow(arrow)
{
    
if ( this .sliding)
        
return ;        
    arrow.style.border
= " 1 outset #ffffff " ;
}


function  OutArrow(arrow)
{
    
if ( this .sliding)
        
return ;        
    arrow.style.border
= " 0 none black " ;
}


function  ClipFolder(folder,top,right,bottom,left)
{
    document.all[
" OB_Folder " + folder].style.clip = clip = 'rect(' + top + ' ' + right + ' ' + bottom + ' ' + left + ')';
}


function  Start()
{
    
if ( ! this .started)
    
{
        
this .ClipFolder( 1 , 0 , this .visibleAreaWidth, this .visibleAreaHeight, 0 );
        
this .SetArrows();
    }
        
}


function  SetArrows()
{
    document.all[
" OB_SlideUp " ].style.pixelTop = document.all[ " OB_Button " + this .currentFolder].style.pixelTop + document.all[ " OB_Button " + this .currentFolder].style.pixelHeight + 20 ;
    document.all[
" OB_SlideUp " ].style.pixelLeft = this .width - document.all[ " OB_SlideUp " ].width - this .borderWidth - 10 ;
    document.all[
" OB_SlideDown " ].style.pixelTop = document.all[ " OB_Button " + this .currentFolder].style.pixelTop + document.all[ " OB_Button " + this .currentFolder].style.pixelHeight + this .visibleAreaHeight - document.all[ " OB_SlideDown " ].height - 20 ;
    document.all[
" OB_SlideDown " ].style.pixelLeft = this .width - document.all[ " OB_SlideDown " ].width - this .borderWidth - 10 ;

    
var  folder = document.all[ " OB_Folder " + this .currentFolder].style;
    
var  startTop = document.all[ " OB_Button " + this .currentFolder].style.pixelTop + document.all[ " OB_Button " + this .currentFolder].style.pixelHeight;

    
if (folder.pixelTop < startTop)
        document.all[
" OB_SlideDown " ].style.visibility = " visible " ;
    
else         
        document.all[
" OB_SlideDown " ].style.visibility = " hidden " ;

    
if (folder.pixelHeight - (startTop - folder.pixelTop) > this .visibleAreaHeight)
        document.all[
" OB_SlideUp " ].style.visibility = " visible " ;
    
else         
        document.all[
" OB_SlideUp " ].style.visibility = " hidden " ;
}


function  HideArrows()
{
    document.all[
" OB_SlideUp " ].style.visibility = " hidden " ;
    document.all[
" OB_SlideDown " ].style.visibility = " hidden " ;
}


function  SlideItems(up)
{
    
this .sliding = true ;
    
this .slideCount = Math.floor( this .slideArrowValue / this .ArrowSlideSpeed);
    up 
?   this .SlideItemsAction( - this .ArrowSlideSpeed) :  this .SlideItemsAction( this .ArrowSlideSpeed);
}


function  SlideItemsAction(value)
{
    document.all[
" OB_Folder " + this .currentFolder].style.pixelTop += value;
    filter 
=   / rect\((\d * )px (\d * )px (\d * )px (\d * )px\) / ;
    
var  clipString = document.all[ " OB_Folder " + this .currentFolder].style.clip;
    
var  clip = clipString.match(filter);
    
this .ClipFolder( this .currentFolder,(parseInt(clip[ 1 ]) - value),parseInt(clip[ 2 ]),(parseInt(clip[ 3 ]) - value),parseInt(clip[ 4 ]));
    
this .slideCount -- ;
    
if ( this .slideCount > 0 )
        setTimeout(
" OutlookLikeBar.SlideItemsAction( " + value + " ) " , 20 );
    
else
    
{
        
if (Math.abs(value) * this .ArrowSlideSpeed != this .slideArrowValue)        
        
{
            document.all[
" OB_Folder " + this .currentFolder].style.pixelTop += (value / Math.abs(value) * ( this .slideArrowValue % this .ArrowSlideSpeed));
            filter 
=   / rect\((\d * )px (\d * )px (\d * )px (\d * )px\) / ;
            
var  clipString = document.all[ " OB_Folder " + this .currentFolder].style.clip;
            
var  clip = clipString.match(filter);
            
this .ClipFolder( this .currentFolder,(parseInt(clip[ 1 ]) - (value / Math.abs(value) * ( this .slideArrowValue % this .ArrowSlideSpeed))),parseInt(clip[ 2 ]),(parseInt(clip[ 3 ]) - (value / Math.abs(value) * ( this .slideArrowValue % this .ArrowSlideSpeed))),parseInt(clip[ 4 ]));
        }
            
        
this .SetArrows();
        
this .sliding = false ;
    }
        
}

}

</ SCRIPT >
<!-- 实际应用时由于按下连接打开页面,所以需要你去掉下面的一段js代码,现在用于产生警告框。这一段代码是在folders.js文件中调用的,打开folders.js最前面可以看到注释 -->
< SCRIPT  language =JAVASCRIPT >
function  Run(app)
{
    alert(
" Application :  " + app);
}

</ SCRIPT >

< META  content ="MSHTML 5.00.2920.0"  name =GENERATOR ></ HEAD >
< BODY ></ BODY ></ HTML >
posted on 2007-04-01 16:46 千山鸟飞绝 阅读(689) 评论(1)  编辑  收藏 所属分类: JavaScript

FeedBack:
# re: QQ树形8
2007-07-26 17:33 | 小白之家
感觉很象小山blog的风格  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航:
 
正在阅读:



<2019年9月>
25262728293031
1234567
891011121314
15161718192021
22232425262728
293012345

常用链接

留言簿(35)

随笔档案

文章分类

文章档案

好友的blog

我的其他blog

老婆的Blog

搜索

  •  

积分与排名

  • 积分 - 750310
  • 排名 - 50

最新评论

阅读排行榜

评论排行榜