js实现div滑动收起效果

最新推荐文章于 2019-11-01 15:21:16 发布

原创最新推荐文章于 2019-11-01 15:21:16 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#div #query #function

这篇博客介绍了如何使用JavaScript来实现一个Div元素的滑动收起效果。通过获取Div的初始高度，并设置定时器逐步减小其高度，最终实现平滑的收起动画。代码中利用了`setInterval`和`clearInterval`函数，以及动态修改样式属性`height`来达到动画效果。

var query_div = document.getElementById('query_div');
                           query_div.style.height = query_div.offsetHeight+"px";
                              var slide = setInterval(function(){
                               if(query_div.offsetHeight<=30){
                                       clearInterval(slide);
                                   }
                               query_div.style.height = query_div.offsetHeight-40+"px";
                           },16);