-webkit-overflow-scrolling:auto | touch;
auto： 普通滚动，当手指从触摸屏上移开，滚动立即停止 touch：滚动回弹效果，当手指从触摸屏上移开，内容会保持一段时间的滚动效果，继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。
兼容写法：
over-flow: auto; /* winphone8和android4+ */
-webkit-overflow-scrolling: touch; /* ios5+ */
<div class="scrollContainer"> <div class="content"> <p>内容1</p> <p>内容2</p> <p>内容3</p> <p>内容4</p> <p>内容5</p> <p>内容6</p> <p>内容7</p> <p>内容8</p> <p>内容9</p> <p>内容10</p> </div> </div>.scrollContainer{ position: fixed; top: 0; height: 1770px; width: 100%; overflow: auto; -webkit-overflow-scrolling: touch; } .content{ height: 6000px; width: 100%; background: skyblue; z-index: 99; }
有几率出现的bug
1.父级元素scrollContainer加上定位position，滑动几次后可滚动区域会卡主，不能在滑动
2.快速滑动页面会出现空白，滑动停止后内容才显示
相关文章详细解读
转载于:https://www.cnblogs.com/YAN-HUA/p/9848004.html
