【发布时间】：2014-10-23 04:31:01
【问题描述】：
我理解并使用过渡和动画，但在我看来，在尝试将它们结合起来时会出现一些“障碍”。例如，如果您有一个以颜色结尾的动画样式，并使用-webkit-animation-fill-mode: forwards; 无限期地设置值，那么如果可以设置覆盖样式，我可以从该状态平滑过渡到另一个状态，这将很有意义。
见jsfiddle。注意切换黄色样式使用的是平滑过渡，但是使用动画只能在动画过程中平滑初始的 0-50%。如果动画值未设置时不会发生突然的即时变化，则无法将最终的绿色状态恢复为纯白色或黄色背景。另请注意，动画在激活时会完全覆盖!important 样式。
我不知道在 spec/WD/etc. 中指定了多少这种行为，但就我而言，这种类型的限制行为使 CSS 动画几乎一文不值，建议使用动画从 javascript 逐步执行，与转换一起使用。这样做的缺点是这样做会大大增加开销。
为了解决“不清楚我在问什么”投票，我要问的是如何制作一个可以从最终动画状态插回的动画？
【问题讨论】：
标签： javascript css css-transitions css-animations