Firefox と Internet Explorer が背景画像をアニメーション化しないのはなぜですか?

Firefox および Internet Explorer のアニメーション背景画像

CSS では、アニメーション背景画像がブラウザ間で一貫して機能しない可能性があります。 Firefox と Internet Explorer は、background-image プロパティに関係するキーフレーム アニメーションを除外することが知られています。

仕様を理解する

CSS 仕様によると、background-image は明示的にアニメーション化できるものではありません財産。ただし、ブラウザーがアニメーション内でこれをどのように処理すべきかについての明確なガイダンスはありません。これにより、ブラウザごとにさまざまなアプローチが採用されました。

Chrome の処理

Chrome では、キーフレーム アニメーションで背景画像が表示されます。これは、アニメーション中に背景画像に変化がない Firefox や Internet Explorer とは対照的です。

Firefox の不一致

Firefox は、背景を処理するときにトランジションとアニメーションを区別します。 -画像。トランジションでは、更新された画像がすぐに表示されます。ただし、アニメーションでは、新しい背景画像が表示されません。

解決策

ブラウザ間の互換性を確保するには、background-image を直接使用しないことをお勧めします。キーフレームで。代わりに、背景の位置や不透明度を調整するなどの別のアプローチを使用することを検討してください。

結論

背景画像アニメーションは Chrome などの一部のブラウザで動作する可能性がありますが、信頼性は高くありません。主要なブラウザ間で一貫した動作を実現します。シームレスなアニメーションの場合は、背景画像プロパティのアニメーション化に依存しない代替方法を採用してください。

以上がFirefox と Internet Explorer が背景画像をアニメーション化しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。