如何停止CSS3转换

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

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

这里的第一个建议的（对于上下文随着jQuery和CSS全顺）小提琴：http://jsfiddle.net/thomseddon/gLjuH/

由于

[2] github.com/madrobby/zepto/问题/ 508

检查了这可能帮助http://stackoverflow.com/questions/5312289/interrupting-stop-a-css3-transition-on-the-actual-position-state – Afshin

谢谢，应该也有它挂钩 –

得到它：http://jsfiddle.net/thomseddon/gLjuH/3/ –

关键是要设置EAC h css属性，你正在动画到它的当前值（可能是中间过渡），如：$(this).css('prop', $(this).css('prop'));（可能会想用$（this）.data（props）将元素中的所有属性存储在元素中。并通过它们循环）。

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

2012-10-18 17:24:10

谢谢你的jsfiddle。我做了一些重构，并将其分解为这里的核心概念：http://jsfiddle.net/jedhunsaker/gLjuH/13/ – jedmao

@mrjedmao - 小提琴链接已死： – Danield

@Danield对不起，我最近更改了我的名字它现在http://jsfiddle.net/jedmao/gLjuH/13/ – jedmao

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

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

就是这样。

2016-03-23 10:31:16

回答