寻找 iScroll 的替代品（iOS/Webkit 上的滚动 Div）

Question

我通过数据移动应用程序构建了一个复杂的表单，现在正在寻找一种解决方案来保留标题和页脚栏的位置。在我的虚拟模型中，它是在桌面上使用 Chrome 和 Safari 开发和测试的，我只是将页眉和页脚以及内容部分定位为绝对位置，其高度由 JavaScript 在 Windows 的调整大小事件中设置。

对于移动世界来说，这不是正确的方法，因为移动 WebKit 不支持 Overflow:auto。

我自己尝试了一些东西，也看了 iScroll。事实上，iScroll 使我的 iPad 上的 safari 崩溃，而没有该组件的应用程序运行得相当流畅。我有很多相对复杂的表格，这对iScroll来说可能是一个挑战，我认为这是赢不了的。

因此，我正在寻找其他方法来实现我的目标（保留页眉和页脚），而不让用户使用两根手指进行滚动（事实上，几乎没有人知道这个“技巧”）。

有什么建议吗？

谢谢！

Answer 1

所以常见的解决方案有以下三种：

1. iScroll
2. YUI ScrollView
3. 滚动性

他们'关于一切都非常适合滚动简单的列表。但是，如果其目的是处理包含多个列表的整页（例如具有动态表单的复杂对话框等），则没有人真正有效。

我决定放弃并等待一年 - 苹果最近宣布支持position:fixed和overflow:scroll，这将彻底改变这部分并解决我们今天遇到的所有此类问题。

今天我想起我们慕尼黑大楼里的一家公司的网站，用iPad打开它，确实，它的首页有一个可滚动的新闻部分。所以我往里面看，发现它正在使用... tadaaa ... jScrollPane。

我不认为 jScrollPane 是为在移动设备上使用而开发的，但它也为此目的进行了优化。它仅适用于我的 iPad、Android 2.3 以及最新的 Opera Mobile。

它不像在移动设备上滚动本机应用程序，但它允许您看到完全可定制的滚动条，跳到顶部和底部，最重要的是，用一根手指滚动 。

很不错。

Answer 2

Mobile webkit 现在仅支持使用 CSS 进行滚动。创建一个“scrollable”类并添加以下规则：

    .scrollable {
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
    }

将“scrollable”类添加到任何需要滚动的块元素。仅限 Webkit。

Answer 3

https://github.com/filamentgroup/Overthro/

基于轻量级填充的解决方案，让现代浏览器具有溢出功能:scroll 支持做他们的事情。

仍处于开发早期阶段，但在最大的受影响用户群（android 2.2/2.3/iOS<5）上运行良好。