Question

我正在创建一个iOS网络应用程序，它具有固定的div（例如200px高度），并且内部的内容滚动。我不喜欢默认的iOS滚动，因为它不像你通过向下滑动网页找到的原生滚动（iOS中的原生滚动有动量，而overflow的默认滚动没有动力）。

我尝试滚动的div具有以下特质：

设置宽度
动态高度（通过AJAX的内容）

使用jQuery AJAX将内容从外部网站加载到div，并且可以选择重新加载AJAX请求。这意味着，根据加载页面中的内容量，div的高度将发生变化。

我似乎无法找到任何允许动态滚动的解决方案，其中div没有设置，我尝试了以下内容：

- webkit-overflow-scrolling: touch
iScroll

以及这些问题：

这是我的第一选择，因为它只是一个css标签，通常可以正常使用。虽然它是新的并且有很多错误，包括我的网络应用程序的交易破坏者。如果您在focus元素上input，页面会放大（即使meta标记设置为user-scalable:no），并且在您输入文本之前不会缩小文本框，然后所有内容都由3px关闭。
此解决方案滞后，需要修复高度。使用它的刷新功能太麻烦，因为需要在重新加载AJAX请求，重新加载页面，隐藏元素等时调用它等。

TL; DR：除-webkit-overflow-scrolling和iScroll之外还有其他解决方案允许我在具有动态高度的div（通过AJAX加载的内容）中使用动量滚动的iOS吗

Answer 1

我目前为克服动态高度问题所做的是在DOM更新后设置高度。我使用以下代码执行此操作：

document.getElementById('content').style.height = window.innerHeight - getPosition('loading')[1] + "px";

在这个例子中，主要的DIV是“内容”。我在DIV上方有一个跨度称为加载，它用作参考点，因为标题的大小会根据您所使用的webapp的哪个部分而改变。以下是getPosition函数：

function getPosition(who){
var e = document.getElementById(who);
var position = {x:0,y:0};
while (e) {
    position.x += e.offsetLeft;
    position.y += e.offsetTop;
    e = e.offsetParent;
}
return [position.x , position.y];};

此外，我相信自iOS 5.0.1以来，缩放已经修复。

iOS div动量滚动没有固定高度（内容通过ajax加载）？

1 个答案: