惯性滚动及引发的问题整理

文章部分内容引自http://www.cnblogs.com/chris-oil/p/6164966.html

前文说到，在iOS上滚动事件不顺滑，有个解决方案是使用-webkit-overflow-scrolling 属性。

简介：-webkit-overflow-scrolling 

一个只有 iOS 设备支持的非标准属性。苹果自己的解释：指定是否在 overflow: scroll 的元素中使用“原生”的滚动方式
包含两个可选值：auto 和 touch
auto：就是普通的无惯性滚动效果
touch：原生的滚动效果。使用此效果会构造一个 stacking context

什么是 stacking context？可以参照这里的解释

-webkit-overflow-scrolling 引发了那些坑？

滚动中 scrollTop 属性不会变化。

严格来说，上面的 scroll 事件不触发只是本坑的一个副作用，所以说不必考虑通过 touchmove 事件转发 scroll 事件等点子，scroll 事件触发了一样检测不到 scrollTop 属性的变化（当然检测手指的移动距离另说）。同样，检测滚动区域内部元素的 getBoundingClientRect 同样无效。

因此，在使用了这个属性之后不能检测到scrollTop属性的变化。

运行时通过 JS 动态添加元素溢出高度导致滚动失效