需求是有一些动态内容折叠起来的，点击后弹开
js定时器的动画过渡暂不考虑，于是就想到transition过渡
一开始就想着用trasition动画过渡就搞定啦，试了一下后，发现有问题
折叠的元素的高度height必须得设置一个值才可以有过渡的效果，要不就过渡不了
折中一下，就用js动态获取子元素的高度，然后给值到折叠的元素上实现过渡了
不过需要注意的是，内容的元素，虽然平常是不显示，但是还是暂据文本流的空间，所以缩起来后，要设置{visibility:hidden}.
打开时再设置{visibility:visible}
<li>
<h4 class="title"></h4>
<div class="container">
<div class="details_content"></div>
</div>
</li>
<style>
.faq_sub_content li .container{ width:100%; transition:all 0.3s cubic-bezier(0.4, 0, 1, 1); -webkit-transition:all 0.3s cubic-bezier(0.4, 0, 1, 1); -webkit-opacity:0; opacity:0; height:0; overflow: hidden;}
.faq_sub_content li .details_content{ background-color:#fff; color:#818181; font-size:14px; line-height:25px; padding:10px 26px; overflow: hidden; width:100%;}
</style>
