CODEWITHSUNDEEP
cssinternet-explorer-11
Zymus
Zymus

Reputation: 1698

Make a grayscale image with css in IE11 running in Quirks mode

I need to convert some colorful images on an internal legacy web application to grayscale. I figured the easiest way would be to use CSS filters. The users of this application access it via IE11 due to a Group Policy. This application must also be run using Quirks (IE5) document mode, otherwise crazy things happen (rendering issues, javascript not working, etc).

I have tried the following code (as well as code from here, here, and here)

img.desaturate {
    -webkit-filter: grayscale(100%);
    filter: gray;
    filter: grayscale(100%);
    filter: url(desaturate.svg#greyscale);
}

with no effect. Given this criteria (IE11 running with IE5 Document mode), is there anything I can do to get these grayscale images, and if so, how?

note: redesigning the application to work with more modern technologies is not currently funded, and will not be in the future.

note: converting each image to grayscale with some script and saving the output is also not an option, as there are millions of images available.

Link to example that shows colorful Google logo: https://jsfiddle.net/bq2mw5ya/2/

Upvotes: 4

Views: 27242

Answers (1)

G-Cyrillus
G-Cyrillus

Reputation: 106008

actually i turn my comment as an answer for feed back:

IE specific filter should stand last, so it is not overide by a next one.

Activex should also allowed to run

and of course, it should be in quirk mode ...

img.desaturate {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: url(desaturate.svg#greyscale);
    filter: gray;
}

Upvotes: 5

Related Questions