我正在制作一个 web 应用程序，并希望使用所有屏幕并尽可能避免滚动。页面的许多区域都会有需要点击的按钮。
当标签栏打开并且我旋转到纵向并返回到横向时，移动 safari 底部的区域不可点击。
我已将正文高度设置为与 window.innerHeight 相同而不是 100%，这样我就不必滚动到底部的按钮。
bodyEl.style.height = window.innerHeight + 'px';
此区域可能无法用于交互式内容。
这是一个带有代码的演示：
http://plnkr.co/edit/327sUQ?p=preview
您应该能够在 iPhone 6 Plus 上通过单击全屏按钮“在单独的窗口中启动预览”来打开它的预览。
这看起来肯定是 iOS8 中的一个错误，它在我的模拟器中的 iOS8.4、9.0 和 10.2 中按预期工作。
【问题讨论】：
标签： javascript css mobile-safari iphone-6-plus
我可能已经找到了您的问题的答案，但很想听听您是否可以确认。将页面内容设置为以下样式：
overflow-y: scroll（允许您在视口下方滚动，但仅在必要时根据内容的长度滚动；默认值为visible）-webkit-overflow-scrolling: touch（平滑任何滚动行为）除了你的height: 100%（它会强制内容填充视口）
似乎强制 Safari 中的 iOS 菜单（顶部的选项卡和地址栏以及底部的导航栏）始终出现。这样一来，点击页面顶部和底部的按钮就不再是“死区”，而是会真正起作用，而不是打开 Safari 菜单。
【讨论】：
我正在寻找类似问题的解决方案 - 这不是答案，而是尝试解释。
首先 - 目前，我无法确认此行为 - 似乎已在 iOS 8.4 (12H143) 中修复。不知道上次看到是哪个版本的。
尽管如此，我还是尝试解释我的发现（直到我们决定不再打扰）。 不可点击区域并不总是死区。如果您在单击之前向上滚动，则很有可能您可以正常工作。因此，我认为（空的）标准导航栏在那里（元素的高度和行为相似/相同），即使在横向模式下它是空的（所有元素都移动到地址栏）。
顺便说一句：
iPhone 6 plus 还存在另一个（类似）问题（尚未修复）。
如果您在网页顶部有一个position: fixed 元素，在横向模式下并且只有打开两个或多个选项卡（并且选项卡栏可见），您可以单击此元素（甚至通过按钮） - 如如果整个事情都不在那里。
【讨论】：
我知道这个问题有点老了，但由于问题仍然存在，我想我应该分享我的经验......
到目前为止，该问题尚无解决方法，但有一种解决方法。 jennz0r 提供的解决方案可能对某些人有用，但我不喜欢菜单栏总是显示的想法。我看到一个网站已经解决了这个问题......好吧，它似乎至少可以工作。我没有在他们的 css 或 js 中找到任何东西。
那么解决方法是什么？ 由于“死区”的高度为 44 像素，他们只是将浮动条的高度设置为 88 像素：D 用户会本能地点击按钮的顶部/中心，并且在第一次尝试时几乎总是可以工作！
另一种解决方法是让按钮/栏从底部浮动 44 像素。
“如果它很愚蠢，但它有效......它并不愚蠢......”;）
【讨论】：