很漂亮的滚动

运行效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<SCRIPT language=javascript type=text/javascript>
    var timer = 100;
    var height = 0;
    function addCount()
    {
     if(timer>0)
     {
      height = height+5;
      timer--;
      //alert(height);
     }
     else
     {
      return;
     }
     if(height>480)   //高度
     {
      return;
     }
     document.getElementById("ads").style.display = "";
     document.getElementById("ads").style.height = height+"px";
     setTimeout("addCount()",1);
    }

    window.onload = function showAds()
    {
     addCount();
     setTimeout("noneAds()",10000); //停留时间自己适当调整
    }
   </SCRIPT>
   <SCRIPT language=javascript type=text/javascript>
    var T = 480;
    var N = 480; //高度
    function noneAds()
    {
     if(T>0)
     {
      T--;
      N = N-5;
     }
     else
     {
      return;
     }
     if(N<0)
     {
      document.getElementById("ads").style.display = "none";
      return;
     }
     document.getElementById("ads").style.height = N+"px";
     setTimeout("noneAds()",1);
    }
   </SCRIPT>
   <DIV class=center>
    <DIV id=ads
    style="BORDER-RIGHT: #000 0px solid; BORDER-TOP: #000 0px solid; DISPLAY: none; MARGIN: auto; OVERFLOW: hidden; BORDER-LEFT: #000 0px solid; WIDTH: 960px; BORDER-BOTTOM: #000 0px solid; TOP: 0px; HEIGHT: 0px; TEXT-ALIGN: center"><A href="http://www.siyuroom.com" target=_blank><IMG height=480 src="http://www.siyuroom.com/images/bg_header.gif" width=960 border=0></A>
    </DIV>
   </div>
</body>
</html>

发表评论取消回复

微信