Filtr CSS obraz w skali szarości dla IE 10

Czy istnieje sposób na sprawienie, aby filtr obrazu w skali szarości działał na IE 10 bez JavaScript lub SVG?Filtr CSS obraz w skali szarości dla IE 10

Używam następujący kod z powodzeniem we wszystkich przeglądarkach z wyjątkiem IE 10.

img{ 
filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter  id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /*  Firefox 10+, Firefox on Android */ 
filter:gray; /* IE6-9 */ 
-webkit-filter:grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ 
-moz-filter: grayscale(100%); 
-o-filter: grayscale(100%);}

Źródło

2013-05-06 Wissam Abyad

Podejście to działa tylko w WebKit i Firefox. To nie działa w IE lub Operze. WebKit jest obecnie jedyną przeglądarką obsługującą filtry CSS, podczas gdy Firefox obsługuje filtry SVG w HTML. Opera i IE obsługują filtry SVG, ale tylko dla zawartości SVG.

Nie ma dobrego sposobu, aby to działało w IE10, ponieważ zrzuciło obsługę starszych filtrów IE. Jest jednak sposób, którego bym nie polecił.

Można ustawić IE10 do renderowania w trybie standardów IE9 stosując następujący meta elementu w głowę:

<meta http-equiv="X-UA-Compatible" content="IE=9">

To skręcić z powrotem na wsparcie dla starszych filtrów IE. Jednak efekt uboczny upuszczenia IE do trybu IE9, gdzie najnowsze osiągnięcia w IE10 nie będą już obsługiwane. W twoim przypadku może się zdarzyć, że nie będziesz już potrzebował tych nowych funkcji, ale jeśli pójdziesz tą drogą, musisz być tego świadomy podczas aktualizacji strony w przyszłości.

Źródło

2013-05-07 00:13:20

To nie zadziała: http://blogs.msdn.com/b/ie/archive /2012/06/04/legacy-dx-filters-removed-from-ie10-release-preview.aspx –

Firefox 35 został właśnie wydany i obsługuje teraz filtry CSS https://developer.mozilla.org/en-US/Firefox/Wydania/35 –