解决safari中iframe嵌入不能滚动的问题

Posted 2020-07-21 Mr.Tan

做完了个webapp之后，开发的时候一直在浏览器上模拟ios，没有任何问题，谁知交差的时候，客户告知在ios浏览器中不能滚动嵌入的iframe，直接就滚动外层整个document了，你知道document本身就有触碰边缘缓动的效果，下图，中间的部分其实就是嵌入了iframe。

解决方法：

<div class="scroll-wrapper">  
    <iframe src=""></iframe>  
</div> 

　　

.scroll-wrapper {  
    -webkit-overflow-scrolling: touch;  
    overflow-y: scroll;  
    /* 提示: 请在此处加上需要设置的大小(dimensions)或位置(positioning)信息! */  
}  
.scroll-wrapper iframe {  
    /* 你自己指定的样式 */  
}