javascript 在移动网络应用程序中删除地址栏的跨平台方法
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9678194/
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
Cross-platform method for removing the address bar in a mobile web app
提问by Fresheyeball
I am working on a mobile web app and am trying to remove the address bar. Its easy enough, unless the <body>'s natural height is not tall enough to allow for scrolling. Try as I might I cannot find a reliable iphone/android, cross device method of insuring that the <body>is tall enough to allow the address bar to disappear. Many of the methods I've seen rely on screen.heightwhich makes the page TALLER than it needs to be. It should be EXACTLY tall enough to allow the address bar to go away and no taller!
我正在开发一个移动网络应用程序，并试图删除地址栏。它很容易，除非它<body>的自然高度不够高以允许滚动。<body>尽我所能，我找不到可靠的 iphone/android 跨设备方法来确保它足够高以允许地址栏消失。我见过的许多方法都依赖于screen.height使页面比它需要的更高。它应该完全高到足以让地址栏消失而不是更高！
Does anyone have a script that handles this perfectly? I all I need to to determine the height of the page minus the address bar for iphone and android.
有没有人有完美处理这个的脚本？我只需要确定页面的高度减去 iphone 和 android 的地址栏。
I've tried:
我试过了：
screen.height //too tall
window.innerHeight //too short
document.documentElement.clientHeight //too short
document.body.clientHeight //almost but too short
JQUERY allowed.
允许使用 JQUERY。
采纳答案by ramblinjan
This sitealso has a few other suggestions, but this no-nonsense, no-worry one is available in a github:gistand answers your question (pasted here for convenience):
该站点还有一些其他建议，但这个严肃、无忧的建议可在github:gist 中找到并回答您的问题（为方便起见，粘贴在此处）：
function hideAddressBar()
{
if(!window.location.hash)
{
if(document.height < window.outerHeight)
{
document.body.style.height = (window.outerHeight + 50) + 'px';
}
setTimeout( function(){ window.scrollTo(0, 1); }, 50 );
}
}
window.addEventListener("load", function(){ if(!window.pageYOffset){ hideAddressBar(); } } );
window.addEventListener("orientationchange", hideAddressBar );
As far as I can tell, the combination of extra height added to the page (which caused problems for you) and the scrollTo() statement make the address bar disappear.
据我所知，添加到页面的额外高度（这给您带来了问题）和 scrollTo() 语句的组合使地址栏消失。
From the same site the 'simplest' solution to hiding the address bar is using the scrollTo() method:
在同一站点，隐藏地址栏的“最简单”解决方案是使用 scrollTo() 方法：
window.addEventListener("load", function() { window.scrollTo(0, 1); });
This will hide the address bar until the user scrolls.
这将隐藏地址栏，直到用户滚动。
This siteplaces the same method inside a timeout function (the justification is not explained, but it claims the code doesn't work well without it):
该站点在超时函数中放置了相同的方法（没有解释理由，但它声称没有它代码就无法正常工作）：
// When ready...
window.addEventListener("load",function() {
// Set a timeout...
setTimeout(function(){
// Hide the address bar!
window.scrollTo(0, 1);
}, 0);
});
回答by ???
I think the way it works is the address bar is hidden when the page wouldn't fit. So you want a page exactly the height of the window including the address bar, i.e. window.outerHeight, no?
我认为它的工作方式是当页面不适合时隐藏地址栏。所以你想要一个与窗口高度完全相同的页面，包括地址栏，即window.outerHeight，不是吗？
