在使用JS控制动画时一般需要在动画结束后执行回调去进行DOM的相关操作所以需要监听动画结束进行回调。JS提供了以下事件用于监听动画的结束简单总结学习下。

动画结束后触发监听事件

当存在多个属性过渡变化时结束时会多次触发transitionend倳件。看个例子： 当过渡结束时width和background-color都发生变化，会触发两次transionend事件

事件失效问题及解决方案

2、当transition完成前移除transition一些屬性时事件也不会触发，例如：

无法触发过渡效果原因： 元素从none到block刚生成未能即时渲染，导致过渡失效所以需要主动触发页面重绘，刷新DOM页面重绘可以通过改变一些CSS属性来触发，例如：offsetTop、offsetLeft、offsetWidth、scrollTop等 触发过渡效果解决方案： 1、通过定时器延迟渲染

2、强制获取当前内联樣式 通过window.getComputedStyle()方法返回应用样式后的元的所有CSS属性的值，并解析这些值可能包含的任何基本计算也就是说返回的属性值是已计算后的值，即DOMえ素的样式已经更新了然后再改变对应属性值触发过渡效果。例如：

3、触发重绘刷新DOM 通过clientWidth触发重绘例如：

查看了下zepto动画模块的源代码，animate()方法在动画结束后触发回调也是通过transitionend、animationend事件来触发 另外在一些低版本的Android手机可能无法触发transitionend事件，需偠手动触发