CSS3过渡：伪元素之后 [英] CSS3 transition for :after pseudoelement
问题描述
查看这个小提琴： http://jsfiddle.net/sajYc/
：之后伪元素的过渡在firefox中起作用，但在基于webkit的浏览器中失败。任何想法，如果这是在未来的版本中出现？任何非jquery overkill解决方法呢？
The transition for the :after pseudo element works in firefox, but fails in webkit based browsers. Any idea if this is coming up in a future release? Any non-jquery overkill workarounds for it?
基本上，我使用它在一个页面上淡出背景图像精灵的两个状态（而不是两个颜色，如在小提琴）。图标的正常和悬停状态之间的平滑过渡。所以我不想添加一堆实际的元素，只是为了使这个动画工作。
Basically, I'm using it on a page to fade between two states of a background image sprite(instead of two colors like in the fiddle). A smooth transition between an icon's normal and hover state. So I don't want to add a bunch of actual elements to it just to make this animation work.
推荐答案
是Webkit浏览器和IE中的一个已知问题：
Unfortunately, this is a known issue in Webkit browsers and IE:
http://css-tricks.com/13555-transitions-and-animations-on-css-generated-content/
然而，图像精灵状态之间的渐变在jQuery中是可行的。本教程给出了良好的运行方式：
However, fading between image sprite states is do-able in jQuery. This tutorial gives a good run down:
这篇关于CSS3过渡：伪元素之后的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
