可以展开、收缩的顶部滑动广告_综合其它特效

模板酷站
  •       2/5
  •       1
  •       2
  •       3
  •       4
  •       5
查看演示效果

      织梦DedeCMS视频教程买空间 租服务器 选网硕互联! 无忧站长工具,百度权重一键全查!

      可以展开、收缩的网页顶部滑动广告代码,JavaScript实现。当打开网页的时候,它会自动慢慢展开,停留几秒钟后就自动慢慢收缩消失。在一些门户网站我们会看到这种广告效果。

      <!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> <title>可以展开、收缩的顶部滑动广告</title> <meta http-equiv="mrc-type" mrc="text/html;charset=gb2312"> <style type="text/css"> body{margin:0;} </style> <script type="text/javascript"> var intervalId = null; function slideAd(id,nStayTime,sState,nMaxHth,nMinHth){ this.stayTime=nStayTime*1000 || 3000; this.maxHeigth=nMaxHth || 90; this.minHeigth=nMinHth || 1; this.state=sState || "down" ; var obj = document.getElementById(id); if(intervalId != null)window.clearInterval(intervalId); function openBox(){ var h = obj.offsetHeight; obj.style.height = ((this.state == "down") ? (h + 2) : (h - 2))+"px"; if(obj.offsetHeight>this.maxHeigth){ window.clearInterval(intervalId); intervalId=window.setInterval(closeBox,this.stayTime); } if (obj.offsetHeight<this.minHeigth){ window.clearInterval(intervalId); obj.style.display="none"; } } function closeBox(){ slideAd(id,this.stayTime,"up",nMaxHth,nMinHth); } intervalId = window.setInterval(openBox,10); } </script> </head> <body> <div id="MyMoveAd" style="background:skyblue;height:12px;text-align:center;overflow:hidden;"> 这里放广告内容哦! </div> <script type="text/javascript"> <!-- slideAd('MyMoveAd',2); --> </script> </body> </html>