更换亮度滤镜

Question

我试图使用jQuery来更改页面上某些图像的亮度滤镜css属性，但是在控制台中出现以下错误：“解析'滤镜'的值时出错。声明被删除。”

这是我正在使用的代码：

function changeBrightness() {
     $("#myImg").css({
     "filter"         : "brightness(50%)",
     "-webkit-filter" : "brightness(50%)",
     "-moz-filter"    : "brightness(50%)",
     "-o-filter"      : "brightness(50%)",
     "-ms-filter"     : "brightness(50%)"
     });
}

我还尝试了上述格式的其他格式，只是看它是否可以工作，但是它们会产生相同的错误：

function changeBrightness() {
     var brightness = "brightness(50%)";
     $("#myImg")
        .css("filter",brightness)
        .css("webkitFilter",brightness)
        .css("mozFilter",brightness)
        .css("oFilter",brightness)
        .css("msFilter",brightness);
}

我也尝试了这种通用格式，希望jQuery能够处理前缀：

function changeBrightness() {
     $("#myImg").css("filter", "brightness(50%)");
}

单击按钮时将调用changeBrightness函数，该函数应将ID为“ myImg”的图像的亮度更改为50％。 我正在使用Firefox 24.7。 CSS3的filter属性是否仅在firefox（或任何其他浏览器）中不起作用？

Answer 1

CSS3的filter属性是否仅在firefox（或任何其他浏览器）中不起作用？

这是MDN的答案 ：

这是一项实验技术

由于该技术的规范尚未稳定，因此请检查兼容性表以获取在各种浏览器中使用的正确前缀。 另请注意，随着规格的更改，实验技术的语法和行为可能会在将来的浏览器版本中发生变化。

Answer 2

Firefox不全局支持它。

查看caniuse.com/#search=filter 。

顺便说一句， caniuse.com是检查此类内容的绝佳资源。