overflow:scroll 在ios 滾動卡頓
阿新 • • 發佈：2017-12-21
加速 scroll 網頁 ssp ios 前端開發 overflow con 應用
使用
-webkit-overflow-scrolling
屬性控制元素在移動設備上是否使用滾動回彈效果.
值
auto
使用普通滾動, 當手指從觸摸屏上移開，滾動會立即停止。
touch
使用具有回彈效果的滾動, 當手指從觸摸屏上移開，內容會繼續保持一段時間的滾動效果。繼續滾動的速度和持續的時間和滾動手勢的強烈程度成正比。同時也會創建一個新的堆棧上下文。
非標準
該特性是非標準的，請盡量不要在生產環境中使用它！
尚未有相關規範。另在Apple提供的Safari CSS 參考文檔中有所提及。
只在ios上有用
實際上，Safari真的用了原生控件來實現，對於有-webkit-overflow-scrolling的網頁，會創建一個UIScrollView，提供子layer給渲染模塊使用。
摘抄：
- 從SVN log看，在WebKit 108400版本左右才支持，所以iOS Safari應該是需要5.0。Android則是在4.0以上支持。
- 從前端開發的角度講，只需要知道CSS的屬性-webkit-overflow-scrolling是真的創建了帶有硬件加速的系統級控件，所以效率很高。
- 從實際開發的角度講，采用這樣的做法相對是耗更多內存的，最好是在產生了非常大面積的overflow時才應用。
overflow:scroll 在ios 滾動卡頓