这只发生在iPhone大小的Safari中。我知道这个问题的“常见修复”是应用-webkit-transform：translate3d（0,0,0）; （按照Serge的回答here），这确实解决了问题，但只有一次。
当用户单击菜单按钮时，“抽屉”菜单会出现问题。菜单将正常显示，但当用手指触摸/滚动时，整个菜单将从页面中消失。应用-webkit-transform: translate3d(0,0,0)可以解决问题，但这只是第一次。如果菜单已关闭并再次打开，则会再次出现此问题。我已经确认-webkit-transform: translate3d(0,0,0)属性仍然是有问题的（但它在Safari开发人员工具中显示为灰色，显示为灰色，没有通过它划掉一条线）。
我在页面中添加了一些JavaScript，这样当菜单打开时，它会将-webkit-transform：translate3d ...属性应用到菜单中，虽然这确实会永久修复问题，但我不认为足够干净，可以成为一个真正的解决方案。
我还尝试将-webkit-overflow-scrolling: touch与-webkit-transform: translate3d(0,0,0)的各种组合应用于父元素，子元素等，并且无法解决“第一次尝试”之外的问题。
答案 0 :(得分：0)
因此，这个着名的Safari问题只出现在position：relative的元素上，我最终通过在滚动容器元素上设置position: fixed来解决问题。无需添加-webkit-overflow-scrolling: touch或-webkit-transform: translate3d(0,0,0)。
如问题部分所述，-webkit-transform: translate3d(0,0,0)解决了问题，但仅限于第一次打开菜单。一旦关闭并重新打开而没有刷新页面，问题就会发生，好像根本没有应用任何修复。
如果您正在处理同样的问题，请考虑使用position: fixed。如果您遇到此问题时，用户会显示并隐藏一个元素（如汉堡包菜单），您应该可以设置位置：固定在用户调用它时显示的父滚动容器上。
答案 1 :(得分：0)
任何其他查看此内容的人：
如果jQuery $( window ).resize(function(){});中包含任何代码，则可以滚动触发。就我而言，我在调整窗口大小时隐藏了一个菜单，该菜单在桌面上可以正常工作，但在iOS Safari中滚动时也会被调用。
请向this answer致谢，以使我指出这个令人沮丧且隐蔽的问题。