iOS safari：滚动在内部位置被破坏：已修复；元素

Question

在 position: fixed; 元素内，如果您在触摸开始时尝试以错误的方式滚动滚动元素，滚动元素将“锁定”。

示例：触摸屏幕并向下拖动，然后向上拖动。该元素不会滚动。如果你松开，等几秒钟，然后尝试向上拖动，它会滚动。
http://12me21.github.io/scroll-test.html

body {
   position: fixed;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
}
#scroll-container {
   overflow-y: scroll;
   height: 100%;
}
#scroller {
   height: 200vh;
   font-size: 50px;
}

<body>
   <div id=scroll-container>
      <div id=scroller>Test<br>more text</div>
   </div>
</body>

这个答案：似乎与我遇到的问题相同，但修复不再有效。它似乎发生在所有固定元素内部，不再由 -webkit-overflow-scrolling: touch; 引起。

现在有办法解决这个问题吗？还是我只需要完全避免 position: fixed;？

Answer 1

将 overflow: hidden; 添加到 <html> 或 <body> 似乎可以解决问题。
我不确定为什么会这样，但我认为问题是 safari 试图滚动 html/body 而不是你想要的元素。
因为可滚动部分在 position:fixed 元素内，滚动 body 没有视觉效果，所以看起来什么都没有发生。

iOS safari：滚动在内部位置被破坏：已修复；元素

iOS safari: scrolling is broken inside position: fixed; elements

html

css

scroll

mobile-safari

ios