直接上demo：
<div class="container showdiv fadediv">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
.container {
overflow: hidden;/*必须用overflow,不然内容会挤出去，就算设置高度为零也没意义*/
}
.showdiv {
height:300px;
transition:height 0.8s ease 0s;
}
.fadediv {
height:0;
transition:height 0.8s ease 0s;
}
通过JS控制showdiv和fadediv这两个类来回切换，控制下拉弹出框的展开与收起