CSS -webkit-filter：灰度（0％）在IE 10和Safari中不起作用

Question

我遇到了CSS样式-webkit-filter的问题：灰度（0％）和过滤器：无法在IE 10和Safari中使用。

例如我有Slider图像，但图像上是灰度滤镜（我需要这个用于主页）

我实现了这个CSS代码：

.page-id-8 .slider-entry-image img{
    min-width:220px !important;
    width:220px !important;
    -webkit-filter: none!important;
    filter: url(""); /* Firefox 10+, Firefox on Android */
    filter: none!important; /* IE6-9 */
    -webkit-filter: grayscale(0%);
}

但是在IE 10和Safari中滑块图像是灰色的：

但我需要这个观点：

URL LINK

我希望有人可以帮助我。

Answer 1

将其用于所有浏览器

-webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: url(grayscale.svg); /* Firefox 4+ */
  filter: gray; /* IE 6-9 */

参考http://labs.voronianski.com/css3-grayscale/

Answer 2

这是一个使用HTML5和jquery

的跨浏览器解决方案

Code

Demo