使用主屏幕图标可以破坏iPhone上的设备高度

Question

我正在使用：<meta name="apple-mobile-web-app-capable" content="yes">并在我的主屏幕上添加一个图标，以便在iPhone上浏览Chrome浏览器。但是，我使用此代码将div高度设置为设备高度的100％会失败。

$(".swiper-container").css({
    "width" : $(window).width(), 
    "height" : $(window).height()
});

如果我正常在Safari上运行该页面，它可以正常工作，但如果我从保存的主屏幕图标运行则不行。有什么想法吗？

干杯。

更多信息：

www.andrewlarking.co.uk/LBSEvents/lbss.html

Answer 1

尝试使用纯javascript而不使用jQuery，将id = swiper-container放入div并使用此代码：

e = document.getElementById('swiper-container');
e.style.height = window.innerHeight + "px";
e.style.width  = window.innerWidth + "px";

Answer 2

最后我在我身上也使用相同的JQuery：

$("body").css({ 
    "min-height" : $(window).height()
});

这解决了它，虽然在iPhone 5上你有黑色边框，就像它是一个iPhone 4应用程序。