iOS 7 Safari 无法滚动带有溢出的 DIV：隐藏或自动答案

【问题标题】：iOS 7 Safari can't scroll DIV with overflow: hidden or autoiOS 7 Safari 无法滚动带有溢出的 DIV：隐藏或自动
【发布时间】：2013-11-01 18:57:39
【问题描述】：

我正在处理一个包含四 (4) 个单独的 DIV 元素的页面，这些元素都相互独立地滚动。在这里使用答案：`-webkit-overflow-scrolling: touch` broken for initially offscreen elements in iOS7 我能够让大部分页面正常工作。侧DIV展开时，仍然有一些页面无法垂直滚动包含主要内容的DIV。

页面结构如下：

...
<div id="paneTop">...</div>
<div id="paneLeft" class="expanded">...</div>
<div id="paneCenter">
  <div>
    <div style="overflow: hidden;">
      <div id="mainContent" style="overflow: auto;">...</div>
    </div>
  </div>
</div>
<div id="paneRight" class="expanded">...</div>
...

在#paneCenter 上设置 touchstart 事件侦听器适用于大多数页面，但这些页面没有额外的 div 层。我已经尝试在 #mainContent 上设置 touchstart 事件侦听器并一直向上设置，但是当 #paneLeft 展开时 #mainContent 不会滚动，即使它在 #paneLeft 折叠时有效，并且无论 paneRight 是否展开都有效。

注意：仅在运行 iOS7 的 iPad 上发现此问题。

【问题讨论】：

标签： ios css ipad ios7 mobile-safari

【解决方案1】：

这是正确的行为。如果您希望它垂直滚动但水平隐藏它，则专门针对它：overflow-x：隐藏（隐藏水平多余部分），并且不要将任何内容设置为overflow-y。这样可以很好地控制元素。

【讨论】：