如何停止CSS3过渡

我想停止正在进行的转换。

我发现一些散布在互联网上的参考文献[1] [2]，但我似乎无法把它拼凑在一起。

这是第一个建议的小提琴（用jQuery和CSS Transit作为上下文）： http ： //jsfiddle.net/thomseddon/gLjuH/

谢谢

[1] https://twitter.com/evilhackerdude/status/20466821462

[2] github.com/madrobby/zepto/issues/508

所以我想出来了： http ： //jsfiddle.net/thomseddon/gLjuH/3/

诀窍是将你动画的每个css属性设置为当前值（可能是中间过渡），如： $(this).css('prop', $(this).css('prop')); （可能想要使用$（this）.data（props）存储元素中对象的所有属性;并循环遍历它们）。

一旦明确设置了属性，就可以运行0s动画来覆盖上一个动画并有效地停止该元素。

有一个更简单的解决方案。如果你想停止转换（而不是暂停转换）。只需将css设置为当前计算的样式即可。例如，在自定义滚动解决方案中，top是过渡属性。

 element.style.top=getComputedStyle(element).top;

就是这样。