今儿个，咱来聊聊我最近捣鼓的一个小玩意儿——animCollapse。说白，就是给网页上的那些个折叠面板，加点儿动画效果，让它们展开、收起的时候，能顺滑点儿，别那么生硬。
我也就是想让页面上的内容，能有个展开收起的功能。你知道的，有时候内容太多，一下子全堆在页面上，看着就累。能折叠起来，需要的时候再点开，这样页面也清爽些。
一开始用最简单的方法，直接控制元素的显示和隐藏。点一下，"唰"的一下就出来，再点一下，"唰"的一下又没。效果是有，但总觉得差点儿意思，太突然，不够优雅。
于是我就开始琢磨，能不能给它加点动画？这样展开、收起的时候，有个过渡效果，看着也舒服些。我上网搜搜，发现还真有现成的解决方案，像什么Animsition、AnimTrap，听着就挺厉害的。不过我这人有点儿强迫症，总想自己动手试试。
我先是研究下*这个动画库，里边儿预设不少动画效果，什么淡入淡出、滑动、旋转啥的，挺全的。但是，直接用在折叠面板上，还是有点儿问题。主要是这个动画，得控制好时机，不能面板还没展开，动画就播完；或者面板都收起来，动画还在那儿演。
然后，我又去翻翻jQuery的文档，看看有没有什么相关的API。还真让我找到！jQuery里有个slideToggle()方法，专门用来做这种折叠效果的，而且自带动画！
我试试，效果还真不错！默认的动画是上下滑动的，展开的时候，内容从上往下慢慢滑出来；收起的时候，内容又从下往上慢慢滑回去。这正是我想要的！
不过默认的动画时间有点儿短，感觉还是有点儿快。于是我又去查查slideToggle()的参数，发现可以自定义动画时间。我试着把时间调长一些，这下看着更顺滑。
后来我又尝试下是否可以直接调*来实现,然后我执行下面的几个步骤：
- 第一步：我先把需要的*文件给加到我的网页里头。
- 第二步：然后再引入jQuery文件。
- 第三步：然后在需要动画的元素上，加上*里对应的class。
经过这么一折腾，我这个小小的折叠面板，也算是有点儿高级感。展开、收起的时候，不再是“唰”的一下，而是有个平滑的过渡动画。看着舒服，用着也顺手。
这只是个小小的尝试。以后有时间，我还想再深入研究下动画这块儿，争取做出更炫酷的效果！