css - Firefoxでぼかしフィルターをアニメーション化するには?

Question

@-webkit-keyframes myBlur{
   from{
      -webkit-filter:blur(0px);
   }
   to{
      -webkit-filter:blur(10px);
   }
}

「ぼかし」は Firefox に実装されていないようで、代わりに svg フィルターを使用できます。上記のコードと同じことを達成するために svg フィルターをアニメーション化することは可能ですか?

score 2 · Accepted Answer

できないATM。

私はすべての方法で試しましたが、アニメーション化 (@keyframe またはトランジションによる) は、Aurora ビルドでも機能しません。

楽しみにしています

score 1 · Accepted Answer

ここでFirefoxのぼかしを取得しました

SVG のぼかしが機能します。SVG アニメーションを試してみませんか?

*-カワカマス

score 0 · Accepted Answer

これはあなたが探しているものですか？

Webkitブラウザ用のWebkitプレフィックスを使用しています。しばらく前に、MozillaがWebkitプレフィックスをサポートすると発表したことは知っていますが、これが実験的なものであるため、それらの1つであるかどうかはわかりません。

// Browser Specific
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);

score 0 · Accepted Answer

Foggy を試してから、ループして and を変更しblurRadiusますOpacity。

4 に答える 4