javascript 固定在移动浏览器上的页脚位置

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4324222/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 11:01:53  来源:igfitidea点击:

Fixed position on a mobile browser for footer

javascriptcssfooter

提问by Cyberomin

Good day, i have a meta like this

美好的一天,我有一个这样的元

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

Now i can get the height view port with js i want to use it to modify my footer so it stays always at the bottom of the screen using either a fixed positioning. here is the footer css

现在我可以使用 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;*/
}

how do i modify this footer using JS to get the right thing. Thank you. @cyberomin.

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

采纳答案by Greg

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

回答by Alex Nolasco

回答by WinkSl

The position:fixed is available since Android 2.2.

position:fixed 从 Android 2.2 开始可用。

However for other devices like IPhone, you must have a solution that simulates the native scroller : this type of solution is available through the JavaScript toolkit Wink. This toolkit allows to make WebApps easily while remaining simple to use (no need to learn an API). Look at the examples on the Scroller component.

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

回答by Daniel

If you by mobile browser mean "mobile safari", you're out of luck, it does not support position fixed.

如果您使用移动浏览器的意思是“移动 safari”,那您就不走运了,它不支持位置固定。

Related answer: Fixed positioning in Mobile Safari

相关答案:固定定位在Mobile Safari

Edit: This project might be helpful for you -> http://cubiq.org/iscroll

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