Dejo esto que hice para mostrar que no hay problema en hacerlo con CSS.
http://codepen.io/pzin/pen/zjgEs
Como soy vago lo hice usando Sass y prefix-free.
Edito: Dado que sólo la última versión de chrome soporta la animación de pseudo-elementos, en versiones anteriores (26) es de suponer que no funcione. Luego en IE9 tampoco, que no es tan sorpresivo. De todas formas en vez de con un pseudo-elemento puede hacerse con algún elemento real. Lo mismo es.