固定位置在移动浏览器的页脚答案

【问题标题】：Fixed position on a mobile browser for footer固定位置在移动浏览器的页脚
【发布时间】：2011-05-18 11:25:40
【问题描述】：

美好的一天，我有这样的元数据

<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalabale=no, width=device-width, height=device-height" />

现在我可以用 js 获取高度视口了我想用它来修改我的页脚，使其始终使用固定定位保持在屏幕底部。这是页脚css

#footer
{
height:30px;
background-color:#D9D9D9;
background-image:url(../images/footer.png);
background-repeat:repeat-x;
margin-top:20px;
width:100%;
/*bottom:0;
position:fixed;*/
}

如何使用 JS 修改此页脚以获得正确的内容。谢谢你。 @cyberomin。

【问题讨论】：

标签： javascript css footer

【解决方案1】：

另请参阅 Google 对此的解决方案 http://code.google.com/mobile/articles/webapp_fixed_ui.html

【讨论】：

【解决方案2】：

document.getElementById("footer").style.position = "fixed";

【讨论】：

是的，这不起作用，我想使用视口的高度来修复页脚，任何提示。
@Cyberomin, .style.bottom = "0px";

【解决方案3】：

如果您通过移动浏览器表示“移动 safari”，那么您很不走运，它不支持固定位置。

相关回答：Fixed positioning in Mobile Safari

编辑：这个项目可能对你有帮助 -> http://cubiq.org/iscroll

【讨论】：

【解决方案4】：

位置：固定从 Android 2.2 开始可用。

但是对于像 iPhone 这样的其他设备，您必须有一个模拟原生滚动条的解决方案：这种类型的解决方案可通过 JavaScript 工具包 Wink 获得。该工具包允许轻松制作 WebApps，同时保持简单易用（无需学习 API）。查看 Scroller 组件上的示例。

【讨论】：