伪元素动画/过渡错误在 WebKit 中已修复

长期以来，WebKit 中一直存在一个错误，即伪元素（如 ::before 和 ::after）无法进行动画或过渡。截至 昨天，由于 Elliott Sprehn 的努力，该错误已修复。您可以打开 Google Chrome Canary 并 查看其运行情况。

他在票证中指出

新的基于 DOM 的 :before 和 :after 伪元素已经支持动画和过渡，但我禁用了支持，以便我们能够在单独的步骤中启用它们。

基于 DOM 嗯？我想知道这到底是什么意思。例如，我们能否将事件绑定到它们？我在 Chrome 开发工具中没有看到它们有任何不同。如果有人知道，请告诉我。

为了记录，Firefox 一直支持此功能。Safari 很可能会在下次更新时支持它（它们是所有浏览器中更新速度最慢的）。Opera 尚不支持。我不确定这种事情是如何传播到移动 WebKit 的。

IE 10 支持伪元素上的动画。过渡也是如此，但有一个奇怪的警告

.x:hover:before { /* By itself, doesn't work */ }

.x:hover {} 
.x:hover:before { /* This works (needs :hover declared) */ }

演示视频 由 Caleb Kester 提供。

我已经很高兴地更新了 这张图表。