在移动端上我们想固定顶部或者底部,想中间区域滚动,用了overflow: auto在安卓上是没有问题,在苹果上很卡,原因是定位问题!
加 -webkit-overflow-scrolling:touch; 样式来解决
滚动区域内的子元素不要有定位或者fixed,会有bug
#错误示范
<div style=" position: absolute; overflow: auto;top: 40px; bottom: 52px; left: 0; right: 0;">
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div style="color: red">这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div style="color: blue">这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div style="color: green">这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>这样在ios上用区域滚动很卡</div>
<div>不要在滑了,到底啦啦啦!</div>
</div>
#正确示范
<div style=" -webkit-overflow-scrolling:touch; position: absolute; overflow: auto;top: 40px; bottom: 52px; left: 0; right: 0;">
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div style="color: red">解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div style="color: blue">解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div style="color: green">解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>解决ios上用区域滚动很卡问题</div>
<div>不要在滑了,到底啦啦啦!</div>
</div>