firefox的替代-webkit-transition？

Question

我正在使用css3使图像变黑和变白，然后在鼠标悬停时对它们进行着色。我使用-webkit-transition在chrome和Safari中获得很好的效果，在火狐上使用.svg解决方案，其中没有图像的过渡。在Firefox上也有可能有过渡吗？

网址: Svenssonsbild.se

css：

img.attachment-full {
filter: grayscale(100%);
-webkit-filter: grayscale(100%); /* For Webkit browsers */
filter: gray; /* For IE 6 - 9 */
-webkit-transition: all 1s ease; /* Fade to color for Chrome and Safari */
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter     id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */

Answer 1

对火狐使用-moz-transition。

Answer 2

使用这个(虚拟数据)

-webkit-transition: all 500ms ease;    /* Chorme  */
-moz-transition: all 500ms ease;       /* Firefox */
-ms-transition: all 500ms ease;        /* IE */
-o-transition: all 500ms ease;         /* Opera */
 transition: all 500ms ease;           /* All */