-webkit-overflow-scrolling:touch
1 .作用:控制元素在移动设备上是否使用滚动回弹效果
2 .
1 .auto:当手指从触摸屏移开，滚动立马停止
2 .touch:当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比
3 .使用场景：当使用overflow-y:sccroll的时候会发现滚动效果很木，很慢。这个时候就可以使用这个属性，让滚动条产生回弹效果，就像原生uos一样流畅
4 .bug 1
1 .使用touch属性，偶尔会卡住不动
2 .是在不行就用better-scroll这种库
3 .在使用这个属性的元素设置position:static:
5 .bug 2:添加动态内容不能滚动
1 .子元素的高度设置为本来高度的+1px，主动触发scrollbar
2 .min-height:"101%"或者height:calc(100%+1px)
6 .bug常见机型。ios8上面。safair对于overflow-scrolling用了原生控件来实现。对于有-webkit-overflow-scroll的网页，会创建一个UIScrollView，提供子layer给渲染模块使用
7 .其他bug
1 .滚动中scrollTop属性不会变化
2 .手势可以穿过其他元素触发滚动
3 .滚动是暂停其他transition
8 .总结
1 .所有可滚动的框架，设置了overflow滚动元素之后默认都是弹性效果了。在ios上面
2 .如果不像上心，直接better-scroll
-webkit-text-size-adjust: none;
overflow-scrolling: touch
touch-action:none
touch-callout
object-fit: contain;
text-size-adjust: 100% !important;
MAC的官方文档没有safair相关的内容
1 .https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
2 .看起来这个文档比较老啊
网友评论