固定页眉和页脚在移动版本的网站

Question

我正在开发我的网站的移动版本，我正在测试我的三星Galaxy S android移动设备运行Froyo（2.2）。

我想，用标准的互联网浏览器查看时，必须在两者之间滚动页面的内容固定头和固定页脚（这是始终显示在屏幕上）。

我试过各种组合与身体和排序（这似乎在PC上的浏览器查看时工作）的填充，但似乎无法找到解决的办法。

有人可以帮忙吗？

注：如果我尝试这样的事：

<div id="header" style="position:absolute; top:0px; left:0px;height:200px;overflow:hidden;"></div> 
<div id="content" style="position:absolute; top:200px; bottom:200px; left:0px;overflow:auto;"></div> 
<div id="footer" style="position:absolute; bottom:0px; height:200px; left:0px;overflow:hidden;"></div> 

两个页眉和页脚是固定的，但内容不滚动，例如它也似乎是固定的。

这可能是当然的了Android的Froyo 2.2的浏览器。

有人吗？

Answer 1

以下网站介绍了此问题的状态。

http://bradfrostweb.com/blog/mobile/fixed-position/

笔者提出了几个解决方案的JavaScript。

• iScroll 4
• Scrollability
• Sencha Touch
• Jquery Mobile

Answer 2

看来位置是：固定仅partially supported在Android 2.2以上版本，如果您还添加了特定的元标记。你还应该注意到它在iOS下完全不受支持。有脚本用来模仿行为，但（我没有在手边。）

Answer 3

因为你很可能只是想这建立一个单一的时间，并希望透明地支持多种移动设备，我会建议你看一看：JQuery Mobile

Article on page layout

Answer 4

如果您已经在用最少的屏幕空间工作，为什么你会希望有一个固定的页眉和页脚？考虑到每个浏览器窗口可能都不够大，以至于无法实用。当某人在横向上查看您的页面时，会发生什么情况，并且您有一个固定的页眉和页脚？

即使上了Nexus S，在800×480，在100％缩放，你会占用一半的页面页眉和页脚，这就是在肖像。在景观，忘掉它...

是否有其他设计可能会奏效吗？

链接的用途是什么？如果它们非常重要，那么以另一种方式重复它们也许是有道理的。