看看我写的.和这里样式差不多.不过一样好用哟.滑动时还有音乐.用的qq的音乐


答案：<HTML><HEAD><TITLE>蓝蝶小秘</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<LINK href=><STYLE>
.navPoint {
    COLOR: white; CURSOR: hand; FONT-FAMILY: Webdings; FONT-SIZE: 9pt
}
P {
    FONT-SIZE: 9pt
}
.smallFont {
    FONT-FAMILY: "宋体"; FONT-SIZE: 10.5pt; TEXT-DECORATION: none
}
</STYLE>
<SCRIPT language=javascript>
var theNewId=0;
var theOldId=0;
var isMoving=false;
var upHei=0;
function MoveBar(newBarId)
{
if (isMoving)return;
if (newBarId==theOldId)return;
theNewId=newBarId;
try{
var tmpOld=document.all("BarShow"+theOldId);
var tmpNew=document.all("BarShow"+theNewId);
document.all("BarCT"+theOldId).style.display="none";
//document.all("BarCT"+theNewId).style.overflow="auto";
}
catch(e){
alert("Wrong");return;}
//bgss.play();
isMoving=true;
Moving();
}
function Moving()
{
upHei+=9;
document.all("BarShow"+theNewId).style.height=upHei+"%";
document.all("BarShow"+theOldId).style.height=(100-upHei)+"%";
if (upHei>=91) 
 { upHei=0;
   document.all("BarShow"+theNewId).style.height="100%";
   document.all("BarShow"+theOldId).style.height="0%";
   document.all("BarCT"+theNewId).style.display="";
   document.all("BarCT"+theNewId).style.overflow="auto";
   theOldId=theNewId;
   isMoving=false;
}
else {setTimeout("Moving()",10);}  
}
var F5flag=false;
function F5true(vl)
{if (vl==116) F5flag=true;}
function trueClose()
{if (F5flag)return;
var Flag;
Flag=window.confirm("你确定要关闭蓝精灵...网络小秘吗?");
if (!Flag){window.open(location.href,"","易做图=no,width=140,height=500,top=20")}
}
var BarbgImg1=new Image();
BarbgImg1.src=http://old.zzzyk.com/article/Article/"images/middle.gif";
var BarbgImg2=new Image();
BarbgImg2.src=http://old.zzzyk.com/article/Article/"images/middleh.gif";

function RemoveImg(itImg,rpSrc)
{
itImg.background=rpSrc.src;
}
function retrue()
{return true;}
</script>
</HEAD>
<BODY bgColor=#003366 leftMargin=0 scroll=no topMargin=0 marginheight="0" marginwidth="0"  onkeydown="F5true(event.keyCode)">

<TABLE border=0 cellPadding=0 cellSpacing=0 height="100%" width="100%">
  <TBODY>
  <TR>
    <TD width="100%">
      <TABLE align=center bgColor=#003366 border=0 cellPadding=0 cellSpacing=0 
      id=mnuList style="HEIGHT: 100%; WIDTH: 140px">
        <TBODY>
        <TR>
          <TD bgColor=#ffffff vAlign=bottom width="42%"><FONT 
            color=#000000> <font color=blue>蓝精灵</font></FONT></TD>
          <TD bgColor=#005d99 width="58%"><IMG height=17 
            src=http://old.zzzyk.com/article/Article/"images/易做图.gif" width=16></TD></TR>
        <TR bgColor=#003366>
          <TD align=right colSpan=2 ><IMG height=4 src=http://old.zzzyk.com/article/Article/"images/blank.gif" 
            width=10></TD></TR>
        <TR>
          <TD align=middle bgColor=#005d99 colSpan=2 id=outLookBarShow 
          style="HEIGHT: 100%" vAlign=top name="outLookBarShow"><!--include file="js/myFavorites.asp"-->
<!--测试滑动的面板  开始-->
<TABLE align=center bgColor=#003366 border=0 cellPadding=0 cellSpacing=0 
        style="HEIGHT: 100%; WIDTH:100%">

<tr>
    <td name=BarTitle0 id=BarTitle0 onclick="MoveBar(0)" onmouseover="RemoveImg(this,BarbgImg2)" onmouseout="RemoveImg(this,BarbgImg1)" nowrap align=center style="cursor:hand;background-color:#cccc99;color:black;height:20;border:1 none navy;" valign="middle" background=http://old.zzzyk.com/article/Article/"images/middle.gif">
    我的收藏夹
    </TD></TR>
<TR>
   <TD align=middle bgColor=#005d99 colSpan=2 id=BarShow0  style="HEIGHT: 100%" vAlign=top name="BarShow0">
   <div id=BarCT0 style='overflow:auto;width:100%;height:100%;display:'>0<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></div>
   </TD></TR>

<tr>
    <td name=BarTitle1 id=BarTitle1 nowrap  onclick="MoveBar(1)" onmouseover="RemoveImg(this,BarbgImg2)" onmouseout="RemoveImg(this,BarbgImg1)" align=center style="cursor:hand;background-color:#cccc99;color:black;height:20;border:1 none navy" background=http://old.zzzyk.com/article/Article/"images/middle.gif">
    我的地址本
    </TD></TR>
<TR>
   <TD align=middle bgColor=#005d99 colSpan=2 id=BarShow1 name="BarShow1" style="HEIGHT:0%" vAlign=top >
   <div id=BarCT1 style='overflow:hidden;width:100%;height:100%;display:none'>
  ddd </div>
   </TD></tr>

<tr>
    <td name=BarTitle2 id=BarTitle2 nowrap onclick="MoveBar(2)" onmouseover="RemoveImg(this,BarbgImg2)" onmouseout="RemoveImg(this,BarbgImg1)" align=center style="cursor:hand;background-color:#cccc99;color:black;height:20;border:1 none navy" background=http://old.zzzyk.com/article/Article/"images/middle.gif">
    我的日记
    </TD></TR>
<TR>
   <TD align=middle bgColor=#005d99 colSpan=2 id=BarShow2 name="BarShow2" style="HEIGHT:%" vAlign=top >
   <div id=BarCT2 style='overflow:hidden;width:100%;height:100%;display:none'>111<br><br><br><br><br><br><br><br><br><br><br><br></div>
   </TD></tr>
<tr>
  &
上一个：用JS定制IE工具栏按钮
下一个：妙用VBScript自制IE工具栏按钮(转)
更多图片编程知识: