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上执行相同的操作（在使用Android 4.x的Nexus平板电脑上测试）时，固定元素会在缩放时消失，但是当此操作完成时，它会在缩放区域中以增加的版本显示。

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

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

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

祝你好运

更新：我添加了一个位置的JS实现：固定到我的示例（性能不好，我知道，仅用于测试目的。） - 仍然与position：fixed相同的行为。是否存在用户缩放页面的事件？

Answer 1

位置：去年在iOS5中刚刚添加了固定支持 - 根据我的经验，Android处理这些元素不一致。

我相信，实现你想要做的唯一可预测的方法就是用JavaScript连接它。可能不是你希望得到的答案，但无论如何，位置：固定在移动设备上很少是正确的解决方案。