CSS3过渡：伪元素之后

Question

看看这个小提琴：http://jsfiddle.net/sajYc/

:after伪元素的转换在firefox中有效，但在基于webkit的浏览器中失败。不知道这是否会在未来的版本中出现？任何非jquery overkill变通办法吗？

基本上，我在页面上使用它来淡化背景图像精灵的两种状态（而不是像小提琴那样的两种颜色）。图标正常和悬停状态之间的平滑过渡。所以我不想为它添加一堆实际元素，只是为了让这个动画有效。

Answer 1

不幸的是，这是Webkit浏览器和IE中的一个已知问题：

http://css-tricks.com/13555-transitions-and-animations-on-css-generated-content/

然而，图像精灵状态之间的淡化在jQuery中是可行的。本教程给出了一个很好的运行：

http://www.tutorial9.net/tutorials/web-tutorials/creative-button-animations-with-sprites-and-jquery-part-2/