-webkit-overflow-scrolling解决移动端iOS滚动卡顿现象
2018-03-07 21:53
274 查看
css3中-webkit-overflow-scrolling使用方法
-webkit-overflow-scrolling: touch; //有回弹效果-webkit-overflow-scrolling: auto; //滑到哪停到哪
实现滚动回弹效果的页面布局 (实战)
html
<div class="containBox no-scrollbar"> <div> 滚动的内容 </div> </div>
css
//清除滚动条
.no-scrollbar::-webkit-scrollbar{
width: 0;
height: 0;
}
//滚动容器
.containBox{
width: 100%;
position: absolute;
top: 50px;
left: 0;
right: 0;
bottom: 50px;
overflow-x: hidden;
/*overflow-y:auto;//不能写,会和下面的产生冲突*/
-webkit-overflow-scrolling: touch;
}
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 解决Web移动端Fixed布局的方案（防止页面露底、overflow-scrolling、iOS下的 Fixed + Input BUG现象、isScroll.js）
- -webkit-overflow-scrolling
- 深入研究-webkit-overflow-scrolling:touch及ios滚动
- 深入研究-webkit-overflow-scrolling:touch及ios滚动
- css：-webkit-overflow-scrolling: touch;
- 网页在Safari快速滚动和回弹的原理： -webkit-overflow-scrolling : touch;的实现
- 移动端开发（一）：解决body体中设置overflow:hidden;屏幕仍然会出现滚动条问题
- -webkit-overflow-scrolling
- -webkit-overflow-scrolling: touch
- ios下使用-webkit-overflow-scrolling:touch带来的bug
- 移动端开发（一）：解决body体中设置overflow:hidden;屏幕仍然会出现滚动条问题
- ios下使用-webkit-overflow-scrolling:touch带来的bug
- -webkit-overflow-scrolling 学习
- webkit私有css3属性 -webkit-overflow-scrolling:touch;
- -webkit-overflow-scrolling：touch;
- -webkit-overflow-scrolling:touch iosBug
- -webkit-overflow-scrolling:touch;在本身没有滚动，动态加入内容撑大后不滚动的bug
- 关于 -webkit-overflow-scrolling:touch 的小bug
- -webkit-overflow-scrolling : touch 快速滚动 回弹 效果
- -webkit-overflow-scrolling