在Android 2.3上修复了带有空白图标的页脚

Question

我们正在为Android和iOS开发混合应用程序，并使用html + css来设置应用程序的样式。然而，我们现在无法解决一个问题：

由于我们需要支持Android 2.3-4.2和iOS 5.1-6.1，我们尝试使用'position：fixed'作为固定的页眉和页脚。为了能够在页脚的选项卡上使用漂亮的“发光”，我们使用webkit-mask-image和渐变背景。这适用于iOS和Android 4+，但不适用于Android 2.3。

此外，如果我们删除页面上的所有“固定”元素，则图标会显示在2.3。

上

这似乎与这个问题很相似：http://www.sencha.com/forum/archive/index.php/t-192463.html?s=9b3768697b19cd9957d1c0ee2b7fe6da但是我们确实使用了一个z-index来解决这个问题，而这个问题就是Android 4.0.3并且在Android 2.3上运行了。然而，Sencha似乎没有使用“position：fixed”作为页眉和页脚。

有人建议如何解决这个问题吗？

Answer 1

我遇到了与SVG图标相同的问题，我发现Android＆lt; 2.3 does not support SVG（使用默认浏览器）。

This article描述了使用canvg.js使用画布渲染SVG的解决方案（即变通方法）。