我正在尝试创建一个web应用程序,当它加载并隐藏屏幕顶部的地址栏时,它将调整大小以填充浏览器窗口。
我目前使用的是在iOS上工作的代码,但它不会在Android上工作。
function setHeight() {
window.scrollTo(0, 1);
var footerH = document.getElementById('footer').offsetHeight;
var wrapperH = window.innerHeight - footerH - 1;
document.getElementById('updatable').style.height = wrapperH + 'px';
}
document.addEventListener('DOMContentLoaded', function() {
setTimeout(function (){
window.scrollTo(0, 1);
setTimeout(function () {
setHeight()
}, 100)
}, 100)
}, false)
该应用程序的内容使用isroll,以便可以滚动,并且在内容下方有一个页脚。id为updatable的div中的内容需要调整到正确的高度,以便应用程序填充整个屏幕。我还没有研究出如何在android上实现这个。
我已经解决了这个问题,通过改变setHeight函数如下:
var footerH = document.getElementById('footer').offsetHeight;;
var wrapperH;
if (android) {
wrapperH = window.outerHeight / window.devicePixelRatio - footerH - 1;
document.getElementById('updatable').style.height = wrapperH + 'px';
window.scrollTo(0, 1);
}
else {
window.scrollTo(0, 1);
//var headerH = document.getElementById('header').offsetHeight;
wrapperH = window.innerHeight - footerH - 1;
document.getElementById('updatable').style.height = wrapperH + 'px';
}