小编his*_*mmy的帖子

我们看到iOS 7中Safari的高度为100%的Web应用程序存在问题.似乎window.innerHeight(672px)与window.outerHeight(692px)不匹配,但仅在横向模式下.最终发生的事情是,在身体高度为100%的应用程序中,您可以获得20px的额外空间.这意味着当用户在我们的应用上滑动时,导航元素会被拉到浏览器镶边后面.这也意味着位于屏幕底部的任何绝对定位的元素最终都会关闭20px.

这个问题也在这里提出了这个问题: IOS 7 - css - html height - 100%= 692px

在这个模棱两可的截图中可以看到:

我们要做的就是解决这个问题,以便在Apple修复bug之前,我们不必担心它.

这样做的一种方法是绝对仅在iOS 7中定位主体,但这几乎将额外的20px放在页面的顶部而不是底部:

body {
    position: absolute;
    bottom: 0;
    height: 672px !important;
}

任何帮助强迫outerHeight匹配innerHeight,或者黑客攻击以便我们的用户看不到这个问题的任何帮助都将非常感激.

在下面的代码中,我试图使它在选择(聚焦)输入时,相关字段集中的"formhead"div改变其背景颜色,并且在模糊时它会改变回来.我想通过在焦点上向同一个div添加一个类,并在模糊时删除该类来实现此目的.jQuery最接近的概念与我正在尝试做的最相似,但是不合适,因为它只会针对父div.是否有其他东西可以使用该类定位最近的div,而不会影响其他字段集中的其他类？或者我是否必须更加具体并且标识形状等？

<fieldset>
<div class="formhead">Heading Title 1</div>
<div class="fieldleft">
    <label for="specificinput">Input Title</label>
    <input type="text" class="forminput" id="specificinput">
</div>
<div class="fieldleft">
    <label for="specificinput">Input Title</label>
    <input type="text" class="forminput" id="specificinput">
</div>
</div>
</fieldset>

<fieldset>
<div class="formhead">Heading Title 2</div>
<div class="fieldleft">
    <label for="specificinput">Input Title</label>
    <input type="text" class="forminput" id="specificinput">
</div>
<div class="fieldleft">
    <label for="specificinput">Input Title</label>
    <input type="text" class="forminput" id="specificinput">
</div>
</div>
</fieldset>

和jQuery:

<script type="text/javascript"> 
$(document).ready(function() {
    $('input').focus(function( ){
    $(this).closest('.formhead').addClass('bluebg');
  });
    $('input').focus(function( ){
    $(this).closest('.formhead').removeClass('bluebg');
  });
});
</script>