IE 11 中的过滤器：灰度（100%）用于图像答案

【问题标题】：filter:grayscale(100%) in IE 11 for imagesIE 11 中的过滤器：灰度（100%）用于图像
【发布时间】：2019-03-13 13:27:16
【问题描述】：

我搜索了整个互联网，但没有得到任何解决方案。

谁能说出 IE 11 和 IE 12 中 css3 filter 和 transistion3d 的替代方案是什么？

我不想使用任何插件。

不适用于 SVG 我想要<img>标签

【问题讨论】：

标签： css internet-explorer-11 internet-explorer-10

【解决方案1】：

由于 IE11 不支持过滤器 - 即有像 this 这样的 hack，但是它必须包含很多看到的 JS here，这意味着在 JS 中编写浏览器检测等等。 -

【讨论】：

【解决方案2】：

您可以尝试添加两种图像，一种是原始图像，另一种是灰度图像。然后，使用 div 来显示这些图像。像这样：

<style>
    .grayscale {
        background-image: url('images/Image1.jpg');
        background-size: cover; /* <------ */
        background-repeat: no-repeat;
        background-position: center center;
    }

        .grayscale:hover {
            background-image: url('images/imag1_gray.PNG') ;
            background-size: cover; /* <------ */
            background-repeat: no-repeat;
            background-position: center center;
        }
</style>
<div class="grayscale" style="width:500px; height:500px">
</div>

结果如下：

在我的选择中，我更喜欢使用一些 JQuery 插件，例如 this。

【讨论】：