CSS iOS safari 开启物理惯性滚动支持

阅读(5433)

移动终端的开发中,在需要滚动的元素容器上,增加如下的css ,即可使滚动更平滑,并支持物理惯性的回弹。


<style type="text/css">
.scrolllist{
    -webkit-overflow-scrolling : touch;
}
</style type="text/css">

safari会创建带有硬件加速的原生控件UIScrollView来实现此效果,使滚动更流畅。

注意:

  1. 移动终端的web开发适用,目前只有iOS 的safari支持
  2. -webkit-overflow-scrolling : touch 需要加到设置了overflow:scroll的外层容器上
  3. Android不支持,也不会支持,因为“已经滚动的足够快了”,相对来说缺少一个惯性回弹的效果。

via: http://blog.csdn.net/hursing/article/details/9186199

Tags: