亮度滤镜css：Safari vs Chrome

Question

我认为我的问题很简单，但我找不到一个简单的解决办法：

这是我的网站

http://www.paperkrop.com/contest

我使用包装两侧的亮度滤镜来获得透视的准确性。

当我在Chrome上时，它看起来像这样：

当我在Safari上时（使用像chrome这样的-webkit-brightness）：

让我们不要关注这里的偏斜和缩放问题，而只关注亮度：

亮度为0.8时，Chrome（和其他浏览器）将其视为亮度的80％

Safari将其视为亮度的20％

有什么简单的解决办法吗？

提前致谢！

编辑：有没有办法在css中与chrome进行不同的safari？或仅为safari制作样式表？这是一个主角吗？

Answer 1

我一直在研究这个问题并且发现了铬＆lt; 26和safari＆lt; 6做了'旧模型'。旧模型为0％是正常的未受影响的亮度，高达100％的任何东西使其比原始亮度更高，任何负面的东西都会变暗。

新模型100％不受影响。

我使用以下jquery来测试哪个模型而不是UA嗅探。

var oldBrightnessModel = $("<div/>").css("-webkit-filter","brightness(101%)").css("-webkit-filter")==""?true:false;

Answer 2

您是否尝试将webkit前缀版本设置为百分比？ E.g。

-webkit-filter: brightness(90%);

Answer 3

血腥的详细信息：根据W3C Filter Effects spec，Chrome是正确的，Safari是不正确的。亮度滤波器应该是RGB空间中的标度（R'= cR，G'= cG，B'= cB），但WebKit中的初始实现是平移（R'= R + c，G'= G + c，B'= B + c）。此后一直是fixed，但是在Safari 6.0发布之后，这种变化就开始了。 Chrome因其较短的发布周期而选择了它，但希望它也应该在下一个Safari版本中修复。