有没有办法防止由于 url bar等 ui 元素而调整视口大小

Question

我的问题是我正在制作一个响应式网站，并希望视口始终全屏显示，例如在文档准备就绪时，我希望正文是可用设备窗口的 100%，包括 url 栏和其他导航元素（如 ios 上的导航元素）的高度，并使其保持这种状态。调整大小正在打破我基于百分比的设计。我已经为视口提供了以下内容：

<meta name="viewport" content="width=device-width, height=device-height, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0" />

html 和 body 的样式如下：

html {
  height: 100%;
  width:100%;
  margin: 0 auto;
  padding:0;
}
body {
    width:100%;
    height:100%;
    margin: 0 auto;
    padding: 0;
}

使用jQuery，我认为我已经成功地在调整大小后抓住了屏幕尺寸并以此方式进行了设置

$(window).resize(function() {
    var height = $("body").css("height");
    $("body").css("height", height);
});

但这只有在用户首先向下滚动时才有效（向上保持 URL 栏就位）

我在表单输入和软键盘上遇到了同样的问题，并使用了这个：

$("#name").focus(function() {
    var height = $("body").css("height");
    $("body").css("height", height);
});

我已经四处寻找解决方案，例如 minimal-ui（在 ios8 上消失），无论如何我需要更多的解决方案，滚动到 0，1、最小高度以及各种其他更复杂的解决方案，例如检查设备类型等，但我似乎无法得到它。我对此相当陌生，所以如果我错过了一些明显的东西，请善待！

Answer 1

请参阅以下内容：

iOS 8删除了"最小UI"视口属性，还有其他"软全屏"解决方案吗？

http://www.html5rocks.com/en/mobile/fullscreen/