Pourquoi Firefox et Internet Explorer n'animent-ils pas les images d'arrière-plan ?

Images d'arrière-plan animées dans Firefox et Internet Explorer

En CSS, les images d'arrière-plan animées peuvent ne pas fonctionner de manière cohérente dans tous les navigateurs. Firefox et Internet Explorer sont connus pour exclure les animations d'images clés impliquant des propriétés d'image d'arrière-plan.

Comprendre la spécification

Selon les spécifications CSS, l'image d'arrière-plan n'est pas une image explicitement animable. propriété. Cependant, il n’existe aucune indication claire sur la manière dont les navigateurs doivent gérer cela dans les animations. Cela a conduit à différentes approches selon les navigateurs.

Gestion de Chrome

Chrome affiche des images d'arrière-plan dans des animations d'images clés. Cela contraste avec Firefox et Internet Explorer, qui ne présentent aucun changement dans les images d'arrière-plan pendant l'animation.

Incohérence de Firefox

Firefox fait la différence entre les transitions et les animations lorsqu'il s'agit de l'arrière-plan. -image. Dans les transitions, il affiche immédiatement l'image mise à jour. Cependant, dans les animations, la nouvelle image d'arrière-plan n'apparaît pas.

La solution

Pour garantir la compatibilité entre navigateurs, il est recommandé d'éviter d'utiliser directement background-image dans les images clés. Envisagez plutôt d'utiliser des approches alternatives telles que l'ajustement de la position ou de l'opacité de l'arrière-plan.

Conclusion

Bien que les animations d'image d'arrière-plan puissent fonctionner dans certains navigateurs comme Chrome, elles ne sont pas fiables. pour un comportement cohérent sur les principaux navigateurs. Pour des animations transparentes, utilisez des méthodes alternatives qui ne reposent pas sur l'animation des propriétés de l'image d'arrière-plan.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!