Maison  >  Article  >  interface Web  >  Comment pouvez-vous obtenir des niveaux de gris d’image multi-navigateurs avec les considérations d’IE10 ?

Comment pouvez-vous obtenir des niveaux de gris d’image multi-navigateurs avec les considérations d’IE10 ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-10-28 13:33:30805parcourir

How Can You Achieve Cross-Browser Image Grayscale with IE10 Considerations?

Niveaux de gris d'image multi-navigateurs avec considérations sur IE10

Internet Explorer 9 et les navigateurs antérieurs prennent en charge les filtres en niveaux de gris via les filtres DX. Cependant, IE10 présente un défi unique en raison de son manque de prise en charge des filtres DX.

Solution d'échelle de gris IE10

Pour obtenir l'effet d'échelle de gris souhaité dans IE10, vous pouvez utiliser un Superposition SVG. Voici un exemple :

<code class="css">img.grayscale:hover {
    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
}</code>

Ressources supplémentaires

  • [Niveaux de gris d'image multi-navigateurs avec CSS](http://www.karlhorky.com/ 2012/06/cross-browser-image-grayscale-with-css.html)
  • [Effets de filtre SVG dans IE10](http://blogs.msdn.com/b/ie/archive/2011/ 14/10/svg-filter-effects-in-ie10.aspx)

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn