移动safari & iOS 11 :网络应用程序和高度(100 by )与导航栏重叠

Question

在Mobile上使用100 the不考虑较低导航栏的高度。

以下面的截图为例。为了显示我的应用程序样的页脚，我需要手动(以一种丑陋的方式，参见下面的代码)从容器的高度减去74‘s。否则，只需将我的页脚隐藏在mobile的导航页脚下面。

有没有一种普通而干净的方法来解决这个问题？

​

​

我使用下面的代码来修复这个问题。对我来说很丑。用户代理推导平台/浏览器和硬编码偏移，以消除本机行为。相信我的解决方案感觉不太好：

编辑

const wrapper:any = document.getElementsByClassName('hack-to-fix-ios-height')[0];
if(wrapper && this.iOS()){
  let height = wrapper.offsetHeight;
  height -= 74;

  // Mobile Safari fix for footer nav
  this.renderer.setStyle(wrapper, 'height', height + 'px');
}

Answer 1

尝试将wrapper.style.height设置为window.innerHeight。我相信这会给你的高度没有肚脐-如果肚脐是可见的。如果你的用户滚动并使肚脐消失。然后window.innerHeight将增加肚脐的高度。