原生js实现网页顶部自动下拉/收缩广告效果-创新互联

知识要点

1.实现原理：

通过递归改变div的高度值达到缓慢下拉的效果。

2.一共分为3个步骤我写了三个函数

第一个show()函数（下拉）：初始值高度h<300的话 h+5  反之return退出停止，调用setTimeout方法30毫秒执行一次+5

第二个hide()函数（收回）：只是高度的判断不同高度h-5 反之return退出停止，调用setTimeout方法30毫秒执行一次-5

第三个dd()函数（再次弹出）：这里要注意的是第二次弹出的div是一个新的div把它的高度设置为0，实现原理与第一个函数一样，

并且一定要在第二个函数（收回）执行后再执行

完整代码

 
 

 

  
广告图
  
哈哈哈哈改装成功
 
 
 

另外有需要云服务器可以了解下创新互联建站www.cdcxhl.com，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。