我正在开发移动网络应用程序,并试图删除地址栏。这很容易,除非 <body>
的自然高度不够高,无法滚动。尽我所能,我找不到可靠的 iphone/android 跨设备方法来确保 <body>
高度足以让地址栏消失。我见过的许多方法都依赖于 screen.height
这使得页面比它需要的更高。它应该足够高以允许地址栏消失并且不能再高了!
有没有人有完美处理这个问题的脚本?我只需要确定页面的高度减去 iphone 和 android 的地址栏。
我试过:
screen.height //too tall
window.innerHeight //too short
document.documentElement.clientHeight //too short
document.body.clientHeight //almost but too short
允许使用 JQUERY。
最佳答案
This site还有一些其他建议,但这个严肃、无忧的建议在 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 );
据我所知,添加到页面的额外高度(这给您带来了问题)和 scrollTo() 语句的组合使地址栏消失了。
在同一站点上,隐藏地址栏的“最简单”解决方案是使用 scrollTo() 方法:
window.addEventListener("load", function() { window.scrollTo(0, 1); });
这将隐藏地址栏,直到用户滚动。
This site将相同的方法放在超时函数中(没有解释理由,但它声称没有它代码无法正常工作):
// When ready...
window.addEventListener("load",function() {
// Set a timeout...
setTimeout(function(){
// Hide the address bar!
window.scrollTo(0, 1);
}, 0);
});
关于javascript - 在移动网络应用程序中删除地址栏的跨平台方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9678194/