一.前言
继上一篇文章jquery stop的探索之后，我们继续对jquery动画animate的研究。
从stop给出参数我们就知道，它适合你去立即停止或者立即结束当前动画，清除或者继续非当前的动画队列。
注意，stop控制的只是该dom对象的动画，无法去控制不同dom的动画执行顺序产生的积累，动画回调也无法避免这种积累，只能设置全局的动画状态参数来控制。
由此可见，stop函数是不需要一个动画队列完完整整地完成的。
然而，很多时候，我们需要一个动画队列执行完成，即便有其它的非常规操作，也只是让这些非常规的操作显得无效。
比如图片轮播，当你快速点击前进或者后退按钮时，轮播的图片不应当在其动画效果还未展示完毕时，就切换到其它位置。它需要展示完成一个图片轮播后，再去响应某个有效的点击，而不是响应每个点击。
而有效的点击则是指：在一个动画完成后（完成一个动画队列的总的duration）的最近一次的点击。
因此，从这个需求来看，jquery的stop函数并非是我们需要的（它适合常见的下拉菜单显示隐藏效果）。
在研究之前，我先声明下，我是基于jquery1.8版本以上的。
----------------------------------------------------------------------------------
二.动画执行顺序
动画都是有执行顺序的，比如，两个动画一起执行，或者一个动画执行完后，再执行另一个动画。
好，我们来看一下示例：
1.同步执行（并行）
注意，同步执行动画是针对不同的动画对象而言，同一动画对象（DOM）其实是串行的。非常合乎逻辑的。
2.按次序执行（串行）
注意示例1中的js代码，无论你用链式写法($('.box1').animate({left:'+=100px'}).silbings('.box2').animate({left:'+=100px'}))，还是我那么分开写两个动画，它们是一起执行的，也就是并行执行。
而为了有先后顺序，你需要把次动画放在前一个动画的回调函数中。
当然，当动画队列太多的时候，你需要queue函数和dequeue函数来优化动画队列代码。详见：http://mrthink.net/jqueryapi-queue-dequeue/
但是，使用该技巧时应当注意，如果需要某个事件来重复执行该动画队列，这种方法就失效了，它只能执行一次。示例：
三.动画完成问题
前面给出的示例看似没有什么问题，都按照我们的预期正确执行了。但是，当你频繁点击go按钮时，问题就出现了。
对于示例1来说，如果我们要等待动画队列执行完毕后再执行，那么这个问题比较容易解决。
我加入了一个全局的动画标识animateFlag，用于判断动画是否执行完毕。但是，这段代码实在是丑陋无比。为了让动画完整地执行，我们却把代码拆分地有些支离破碎，一点都不优雅。
对于示例1，因为动画是并行执行，所以，只需要在其中一个动画的完成回调函数中进行动画完成动画标识animateFlag的设置即可。这时，你再快速点击go按钮（在一个duration时间范围内），动画没有积累了，只执行一次，等到执行完后，才响应完成后的第一个点击事件。
那么对于示例2的串行执行动画，我们要让其完整执行后再响应go按钮的点击事件，该怎么做呢？
来看一个示例：
以上技巧解决串行动画完成问题可以说是屡试不爽啊！
但是，我遇到了一个比较奇葩的问题，以上的技巧有些失效了。animate使用opacity属性来显示和隐藏动画时，就会产生bug。
这个问题，我也不知道如何解决。