iOS6、android和位置：固定和缩放

Question

我有一个网站，配置如下：

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=5.0;minimum-scale=1.0;user-scalable=1;" />

和一个带有

的 div 元素

<div style="position:fixed;top:0;left:0;width:100%;height:40px;">Fixed Header Content</div>

（您可以在此处找到示例：http://massmatics.de/demo/test.html）

在 iOS 上观看此网站并进行缩放时，此元素的大小会增加，但会超出缩放区域。

在 android 上执行相同操作时（在 Nexus 平板电脑上使用 Android 4.x 测试），固定元素会在缩放时消失，但当此操作完成后，它会在缩放区域以放大版本显示。

我认为chrome的行为是对的，但我现在的问题是：

有没有办法在 android 上获得与在 iOS 上相同的行为？

我问的原因是我的页面上有很多内容，在小型设备上查看时应该缩放，但在 Android 上，放大的固定元素占用了所有空间，所以缩放并不是真正的优势.

最好的问候

更新：我在示例中添加了 position:fixed 的 JS 实现（我知道，性能很差，仅用于测试目的。） - 仍然与 position:fixed 的行为相同。是否有用户缩放页面的事件？

Answer 1

position:fixed 支持是去年在 iOS5 中添加的 - 根据我的经验，Android 处理这些元素的方式不一致。

我相信完成您正在尝试做的事情的唯一可预测的方法是使用 JavaScript 将其全部连接起来。可能不是您希望的答案，但 position:fixed 无论如何都不是移动设备上的正确解决方案。