无论如何将css3过渡动画添加到jQuery事件上的元素

有没有办法在jQuery事件上添加css3动画，例如：

 .box{ width:100px; height:100px; bakground-color:#000; } .animate{ width:0px; -webkit-transition-property: width; -webkit-transition-duration: 500ms; -moz-transition-property: width; -moz-transition-duration: 500ms; }   
 click me to animate $('button').click(function(){ $('.box').addClass('animate'); });  

Answer 1

只是把

  -webkit-transition-property: width; -webkit-transition-duration: 500ms; -moz-transition-property: width; -moz-transition-duration: 500ms; 

在.box声明中。 你的JS很好。

Answer 2

我认为animo.js可能是你的答案http://labs.bigroomstudios.com/libraries/animo-js （来自http://tympanus.net/codrops/collective/collective-80/ ）

根据他们的网站……

“你可以轻松地叠加动画，一个接一个地发射，指定完成动画的回调，或者只是在任何事件或任何你喜欢的时刻发射动画。”