<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>无标题页</title> <style type="text/css"> *{margin:0px auto} body{margin:0px auto 0px auto;text-align:center;padding:0px;} </style> </head> <body> <div id="div123" style="width:980px;height:50px;background:red;display:block;margin-top:-50px;">a<br />b<br />c<br /></div> <div style="width:980px;height:1000px;background:black;color:#fff">def</div> <script type="text/javascript"> var obj = document.getElementById("div123"); var height=-50,current; var Timer; obj.style.display="block"; Timer=setInterval(SlideDown,10); function SlideDown(){ current = GetHeight(obj); if(current>=0){ clearInterval(Timer); setTimeout(function(){ Timer = setInterval(SlideUp,10); },2000); } else{ current++; SetHeight(current); } } function SlideUp(){ if(current<=height){ clearInterval(Timer); } else{ current--; SetHeight(current); } } function GetHeight(){ return parseInt(obj.style.marginTop); } function SetHeight(h){ obj.style.marginTop=h+"px"; } </script> </body> </html>