跨平台的方式在移动Web应用程序删除地址栏 [英] Cross-platform method for removing the address bar in a mobile web app
问题描述
我工作的一个移动网络应用程序，我想删除地址栏。它很容易，除非＆LT;身体GT; 的自然身高不够高，允许滚动。试试我可能我无法找到一个可靠的iphone /安卓，确保跨设备的方法，该＆LT;身体GT; 足够高，让地址栏消失。很多我见过的方法依赖于 screen.height 这使得页面高度比它需要。它应该是完全足够高，能够让地址栏消失，也没有长高！
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.height which 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!
有没有人有完全处理这个脚本？我所有我需要来确定页面减去iphone和android的地址栏的高度。
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.
我已经试过：
screen.height //too tall
window.innerHeight //too short
document.documentElement.clientHeight //too short
document.body.clientHeight //almost but too short
JQUERY允许的。
JQUERY allowed.
推荐答案
的这个网站也有一些其他的建议，但没有废话，没有担心的是提供一个的 github上：依据并回答您的问题（粘贴在这里为方便起见）：
This site also has a few other suggestions, but this no-nonsense, no-worry one is available in a github:gist and answers your question (pasted here for convenience):
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 );
据我所知道的，额外的高度结合添加到页面（这导致问题你）和scrollTo（）语句进行地址栏消失了。
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:
window.addEventListener("load", function() { window.scrollTo(0, 1); });
这将隐藏地址栏，直到用户滚动。
This will hide the address bar until the user scrolls.
本网站放置一个超时函数中同样的方法（理由没有解释，但它声称没有它的code不能很好地工作）：
This site places 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);
});
这篇关于跨平台的方式在移动Web应用程序删除地址栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
