使用 overflow:Scroll 时在 mobile/ios 上滚动缓慢

Question

要设置关闭-canvas 菜单，我必须将正文设置为 "overflow:hidden" 以从正文中删除滚动并将其添加回内容周围的容器中 "overflow-y:scroll".当我这样做时，它似乎会减慢移动设备上的滚动速度，特别是 iOS 设备。

从正文中移动滚动条是否存在某种性能问题？

Answer 1

这可能不是性能问题，而是您没有看到 'Momentum' 在您的 iOS 设备上滚动

这可以通过在滚动元素中添加“-webkit-overflow-scrolling:touch”来解决，即：

.scrolling-content {
   overflow-y: scroll;
   -webkit-overflow-scrolling: touch;
   height:100%; /*A value other than height:auto needs to be set*/
}

默认情况下 iOS 设备在主体上使用 'momentum' 滚动，但将 'overflow-y:scroll' 添加到元素不会默认将元素设置为 'momentum' 滚动

有关详细信息，请参阅 https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-overflow-scrolling

注意：在某些浏览器上使用 -webkit-overflow-scrolling: touch 有很多 Gotcha/Bugs

使用 overflow:Scroll 时在 mobile/ios 上滚动缓慢

Scrolling slow on mobile/ios when using overflow:Scroll

css

mobile

overflow

ios