Css滤镜模糊功能在Cordova app，Android 4.4.2，Nexus 4中无法使用

Question

我正在尝试为模态窗口后面的图层应用模糊效果，它在webapp，iOS上正常工作但在Android上失败。 我知道Android刚开始支持4.2我相信的css过滤器。

.blurred {
  margin: -5px -10px;
  -webkit-filter: blur(2px);
  filter: blur(10px);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

我尝试使用Chrome检查器应用其他过滤器并且它们工作（如灰度），也尝试将模糊应用于页面上的其他元素但没有成功。

这是实施中的一个错误，模糊不起作用或我错过了什么？

奇怪的是，Modernizr将cssfilters类添加到html中，因此它检测到用户代理能够显示它们。 也许它只测试灰度或类似的东西，因为Modernizr测试返回true - 只是一个侧面说明。

对于任何反馈，我们都表示感谢。

Answer 1

http://caniuse.com/css-filters

查看“Android浏览器”列。 这代表了Android浏览器以及WebView中使用的浏览器技术，该技术由Phonegap / Cordova实例化。 您似乎需要Android 4.4才能获得常规过滤器支持。 :(

总的来说，我发现http://caniuse.com是一个很好的参考，可以用Phonegap / Cordova在跨平台开发中出现这些小问题。

我在桌面上的Chrome中进行主要开发。 我发现这与iOS浏览器技术中的功能相比更接近于Android浏览器技术的类似老化硬件。 因此，在实践中，我一直在不断制作可在桌面上正常工作且在iOS上运行良好的新功能的工作版本。 然后我尝试Android，它不起作用。 然后我咨询http://caniuse.com并弄清楚“哦，那个CSS功能iOS有3个版本之前？是的，直到Android 4.4才会支持...”。

比你要求的多一点，但随着你的继续，可能会有所帮助。

Answer 2

我和你有同样的问题。 当我使用Android 4.4.2（lenovo）时，过滤器不起作用。 我使用wenire进行调试，发现Android 4.4.2支持过滤器，但仅限于<img> 。 它不能用于<div>或任何其他元素。