说明该bug需要条件:父元素需要使用绝对定位或者fixed定位固定,使用overflow:scroll/auto(或者overflow-y:scroll/auto),内部子元素是动态调整大小的(例如,更大的svg文档、近似内联iframe等)。出现BUG的原因:官方没有相关文档描述BUG。自己查阅文档和测试时的总结:iOSsafari会把overflow:scroll元素识别为一个单独的ScrollView,并给它一个-webkit-overflow-scrolling属性为auto。safari中的网页本身就是一个很大的ScrollView。在文档流外定位时,如果在ScrollView建立之前没有确定子元素的高度,则不会触发内部滑动,会触发外部滑动。关于-webkit-overflow-scrolling:SafariCSSReference官方是这样描述的:指定是否在overflow:scroll元素中使用native-stylescrolling。也就是说,这个属性会让overflow:scroll元素变得像原生iOS滑动效果一样流畅。为了达到这个目的,safari使用了所有的overflow:scroll元素来原生创建一个ScrollView。当-webkit-overflow-scrolling属性为touch时,开启硬件加速,出现平滑效果。在不离开文档流的情况下分析父元素就没有这个bug。当父元素没有指定-webkit-overflow-scrolling:touch时,肯定会出现无法滑动的问题。当内部元素是一个普通的html元素时,就没有这个bug。为父元素重置overflow属性时,可能会导致safari重新构建ScrollView,bug消失。(实验室之前的版本是用这个方法解决的,但是新的海外版不能用这个方法修复,所以是可以的)解决方法:根据上面的分析和大量的测试,完美的解决方法是:它必须用于所有移动设备。overflow:scroll元素添加了属性-webkit-overflow-scrolling:touch。当父元素可以脱离文档流时,不要脱离文档流。子元素iframe加载完成后,可以异步重写父元素的overflow:scroll属性(此方法未必成功)。如果以上没有解决,给子元素一个min-height,大小不限(稍微大一点效果最好),帮safari搭建一个ScrollView(亲测最有效)。更新已找到此问题的根本原因。详见:iOSsafari浏览器溢出:滚动元素无法滚动bug
