CSS 3 过滤器(模糊)不使用过渡持续时间

Question

我发现了这种用于跨浏览器模糊的巧妙技术。但看起来过渡并没有产生效果，所以我将其 fork 并设置过渡时间和模糊量，果然它立即发生了。

img.blur {
-webkit-filter: blur(30px); -moz-filter: blur(30px);
-o-filter: blur(30px); -ms-filter: blur(30px); 
filter: url(#blur); filter: blur(30px);  filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');
-webkit-transition: 2s -webkit-filter linear;
-moz-transition: 2s -moz-filter linear;
-o-transition: 2s -o-filter linear;
transition: 2s filter linear;
}

http://codepen.io/CSobol/pen/LGCiw

transition: filter 是否出于某种原因不能用于模糊？

Answer 1

Transition 没有前缀，但是 filter 没有，所以 transition 覆盖了 webkit-transition，但是不知道如何处理没有前缀的过滤器。此修改有效:

transition: 2s -webkit-filter linear;