css - 移动 Safari 上的 webkit 过滤器？

Question

在我看来，我记得看到 webkit-filters 在 Mobile Safari 中工作，但我遇到了麻烦。这段 CSS 代码在我的桌面浏览器中显示良好，但在我的 iPhone 上显示不出来。有什么线索吗？我使用的是 iOS v6。

我所做的只是通过 jQuery 添加/删除类。

.redtint {
  -webkit-filter: saturate(15) hue-rotate(330deg) brightness(110%);
  -moz-filter: saturate(5) hue-rotate(330deg) grayscale(110%);
}

当我在桌面上查看我的元素时，它显示带有 webkit 设置的 redtint，但是当我在我的手机上查看它们时(使用 Adob​​e Edge Inspect)，redtint 是空白的。

Answer 1

事实证明，Chrome 和 Mobile Safari 对亮度过滤器的解释存在差异。

我主要在 Chrome 桌面上进行测试。如果我将 100% 用作基线值(亮度没有变化)，其中 80% 较暗，120% 较亮，则一切正常。

Mobile Safari 使用 0% 的基线表示没有变化，-20% 变暗，20% 变亮。

我的 Web 应用程序仅适用于 iPhone，因此我不必费力解决问题。