CSS 在 iPhone Mobile Safari 中单指滚动内部内容 (div/iframes)
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5921688/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Single finger Scrolling for inner contents (div/iframes) in iPhone Mobile Safari
提问by Salini Krishnan
Sub: iPhone mobile safari web application
子：iPhone 移动 Safari Web 应用程序
I need to keep some parts of a web page visible even when a user scrolls. The CSS property position:fixed does not work as expected. Using the overflow:auto property on or needs two-finger scrolling which is not what I want.
即使用户滚动，我也需要保持网页的某些部分可见。CSS 属性 position:fixed 无法按预期工作。使用 overflow:auto 属性或需要两指滚动，这不是我想要的。
Is there any way to provide single finger scrolling on the inner 'div' or 'iframes' contents using javascript or iphone safari Touch API (touchMove event)?
有没有办法使用javascript或iphone safari Touch API（touchMove事件）在内部'div'或'iframes'内容上提供单指滚动？
回答by Arvind Thyagarajan
In CSS (for iOS 5):
在 CSS 中（适用于 iOS 5）：
-webkit-overflow-scrolling: touch;
回答by scottbates22
Natively it is not possible, either with a div or iframe, so it must be solved with javascript listening for the touch events. I'm researching this same problem for a project and at the moment I have found a couple javascript libraries that are solving this problem.
本机无法使用 div 或 iframe，因此必须使用 javascript 侦听触摸事件来解决。我正在为一个项目研究同样的问题，目前我发现了几个解决这个问题的 javascript 库。
I'm looking into this one at the moment, but I haven't commited to it yet.
我目前正在研究这个，但我还没有承诺。
Joe Hewitt of Three20 fame has recently started dev on solution for this as well, but he's really early in dev process where as the other one has been around for a couple years now.
Three20 名人 Joe Hewitt 最近也开始为此开发解决方案，但他在开发过程中确实处于早期，而另一个已经存在了几年。
回答by Soyoes
You can use just One finger, but you have to provide style.height of the inner DIV
您可以只使用一根手指，但您必须提供内部 DIV 的 style.height
<div id="container-div" style="overflow:hidden">
<div id="inner-div" style="overflow-y:auto; height:1024px">
<!-- IMPORTANT!! you must specify the height of the inner div to make it scrollable -->
