Javascript iPhone6Plus、Safari和iOS8中的死区。当选项卡可见时，底部区域将失去交互性

我正在制作一个网络应用程序，希望使用所有屏幕，尽可能避免滚动。在页面的许多区域都有需要单击的按钮

当标签栏打开，我旋转到纵向和横向时，mobile safari底部的区域不可单击

我已经将身体高度设置为与window.innerHeight相同，而不是100%，这样我就不必滚动到底部的按钮

bodyEl.style.height = window.innerHeight + 'px';

可能该区域不可用于交互式内容

下面是一个带有代码的演示：

您应该能够通过单击全屏按钮“在单独的窗口中启动预览”，在iPhone6Plus上打开预览

更新：

---

它看起来确实像是iOS8中的一个bug，在我的模拟器中，它在iOS8.4、9.0和10.2中正常工作。

我正在寻找一个类似问题的解决方案-这不是一个答案，而是一个解释的尝试

首先——目前，我无法确认这种行为——它似乎在iOS 8.4（12H143）中得到了修复。我不知道上次是在哪个版本看到的

然而，我试图解释我发现了什么（直到我们决定不再打扰）。 不可点击区域并不总是死区。如果在单击之前向上滚动，则很有可能使其正常工作。因此，我认为（空的）标准导航栏在那里（元素的高度和行为相似/相同），即使在横向模式下它是空的（所有元素都移动到地址栏）

---

顺便说一句： iphone6plus还有一个（类似的）问题（尚未修复）。

---

如果您在网页顶部有一个

位置：固定的
元素，在横向模式下，并且只有当有两个或多个选项卡打开（并且选项卡栏可见）时，您才可以单击该元素（甚至通过按钮），就好像整件事都不存在一样。
我可能已经找到了您问题的答案，但是如果你能证实的话，我很想听听。将页面内容设置为具有以下样式：


overflow-y:scroll
（允许您在视口下方滚动，但仅在需要时按内容长度滚动；默认值为
可见
）
-webkit溢出滚动：触按
（可平滑任何滚动行为）

除了
高度之外：100%
（强制内容填充视口）

显示以强制Safari中的iOS菜单（顶部的选项卡和地址栏以及底部的导航栏）始终显示。这样，点击页面顶部和底部的按钮就不再是“死区”，实际上可以工作，而不是打开Safari菜单。
我知道这个问题有点老了，但由于这个问题仍然存在，我想我应该分享我的经验

到目前为止，这个问题还没有解决方案，但有一个解决办法。jennz0r提供的解决方案可能对某些人有效，但我不喜欢总是显示菜单栏的想法。我看到一个解决了这个问题的网站。。。嗯，至少它似乎起作用了。我没有在他们的css或js中找到任何东西

那么解决办法是什么由于“死区”的高度为44px，用户只需将浮动条的高度设为88px:D用户会本能地点击按钮的顶部/中心，并且在第一次尝试时几乎总是可以工作

另一个解决方法是简单地使按钮/条从底部浮动44px

“如果这是愚蠢的，但它起作用了……这不是愚蠢的……”；）
 是的，它看起来确实像是iOS8中的一个bug，它看起来像是在我的模拟器中的iOS8.4、9.0和10.2中预期的那样工作。如果它们仍然存在，你能发布到这些解决方法的链接吗。谢谢。只需尝试将以下代码添加到plnkr（）。条形图底部可单击{height:88px；line height:88px；}的可能副本