我们先来看看回弹滚动在手机浏览器发展的历史:
· 早期的时候,移动端的浏览器都不支持非body元素的滚动条,所以一般都借助 iScroll;
· Android 3.0/iOS解决了非body元素的滚动问题,但滚动条不可见,同时iOS上只能通过2个手指进行滚动;
· Android 4.0解决了滚动条不可见及增加了快速回弹滚动效果,不过随后这个特性又被移除;
· iOS从5.0开始解决了滚动条不可见及增加了快速回弹滚动效果
在iOS上如果你想让一个元素拥有像 Native 的滚动效果,你可以这样做:
.xxx {
overflow: auto; /* auto | scroll */
-webkit-overflow-scrolling: touch;
}
PS:iScroll用过之后感觉不是很好,有一些诡异的bug,这里推荐另外一个 iDangero Swiper,这个插件集成了滑屏滚动的强大功能(支持3D),而且还有回弹滚动的内置滚动条。iDangero官方地址: :www.idangero.us/swiper/#.VX_t9PmEB8Y