仿googletoolbar导航菜单

一直感觉google中国的导航菜单风格不错~闲来无事仿造了一个~O(∩_∩)O~

当然：google的那个不敢比~凑合着用吧~

代码如下：

<div>The google toolbar</div>
<div id="floatdiv" style="width:50px; height:37px; margin-top:3px; overflow:hidden;">
 <a href="#"><img id="img1" src="toolbar.png" border=0 style="margin-top:-222px;" onMouseOver="floatShow()" onMouseOut="floatHidden()"></a>
</div>
<script language="javascript">
var ml= 0, ml2= 210, T1, T2, T3, T4;
function floatShow()
{
 clearTimeout(T1);
 clearTimeout(T4);
 if(ml < 208)
 {
  ml = ml + 52;
  document.getElementById("img1").style.marginLeft = -ml + "px";
  if(ml <= 156)
   T1 = setTimeout("floatShow()",100);
  else
  {
   T1 = setTimeout("floatShow()",50);
   T2 = setTimeout("bulletTop()",10);
   T3 = setTimeout("bulletBlow()",150);
  }
 }
 else
 {
  clearTimeout(T1);
  ml = 0;
 }
}
function floatHidden()
{
 clearTimeout(T1);
 clearTimeout(T4);
 if(ml2 > 0)
 {
  if(ml2 == 210)
  {
   T2 = setTimeout("bulletTop()",10);
   T3 = setTimeout("bulletBlow2()",150);
   T4 = setTimeout("floatHidden()",150);
  }
  else
  {
   ml2 = ml2 - 52;
   document.getElementById("img1").style.marginLeft = -ml2 + "px";
   if(ml2 > 156)
   {
    T4 = setTimeout("floatHidden()",10);
   }
   else
   {
    T4 = setTimeout("floatHidden()",50);
   }
  }
 }
 else
 {
  clearTimeout(T4);
  ml2 = 210;
 }
}
function bulletTop()
{
 document.getElementById("floatdiv").style.marginTop = "0px";
}
function bulletBlow()
{
 document.getElementById("floatdiv").style.marginTop = "3px";
}
function bulletBlow2()
{
 document.getElementById("floatdiv").style.marginTop = "3px";
 ml2 = ml2 - 2;
}
</script>

 

以上代码纯属虚构~如有雷同纯属巧合~O(∩_∩)O~