在 iPad 上滚动 GWT 窗口中的 iframe
请注意：这不是“使用两根手指滚动”问题。无论是一根手指、两根手指、三根手指还是整只手，出于某种原因，我们的 iframe 都无法在 iPad 上滚动。 :)
场景如下：
在使用 EXT-GWT 构建的 Web 应用程序中，我们有一些窗口作为（最大化）弹出窗口打开，并向用户呈现一些表单。这些表单大多数时候是外部的，在 iFrame 中呈现，并且某些表单的内容在初始加载时折叠 - 用户可以选择展开表单的任何部分，填写并提交。现在，除了 iPad 中的滚动之外，一切正常。 iframe 的内容加载并折叠后（折叠是在客户端使用 JS 完成的，基本上，内容默认加载为展开，然后由 JS 折叠），iPad 无法为 iframe 提供滚动。即使 iframe 的内容展开后，iframe 也不会发生任何滚动。
到目前为止，我们已经通过将 EXT-GWT 窗口的高度（使用 JavaScript）增加到展开的 iframe 正文内容的大小来解决这个问题。这使得整个窗口可滚动，而不仅仅是窗口内的 iframe。虽然它有效，但窗口变得很大，所以我想知道是否有更好的方法来为 iframe 提供滚动。
感谢您的帮助， 镍丁
PLEASE NOTE: This is not a "use two fingers to scroll" problem. Whether it is one finger, or two, or three, or the whole hand, for some reason our iframe does not scroll on an iPad. :)
Here is the scenario:
In our web application, which is built using EXT-GWT, we have a few windows that open as (maximized) pop-ups and present some forms to the users. These forms, which are most of the times external, are rendered in an iFrame and some of the forms have their content collapsed at the initial load - the user can choose to expand any section of the form, fill it in and submit. Now everything works fine except the scrolling in iPad. After the iframe's content is loaded and collapsed (collapsing is done using JS on the client side, basically, the content loads as expanded by default and then is collapsed by JS) iPad just fails to provide scolling to the iframe. Even after the content of the iframe is expanded the iframe does not get any scrolling.
As of now, we have solved this problem by increasing the height (using JavaScript) of the EXT-GWT window to the size of the expanded iframe body content. This makes the whole window scrollable, instead of just the iframe within the window. While it works, the window becomes way to big, so I was wondering if there is any better way for us to provide scrolling to the iframe.
Thanks for the help,
Nitin
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
对于iOS设备，您需要设置overflow: auto;否则滚动将不起作用。对于我的网络应用程序，我使用 fancybox 以模式方式显示 iframe，一旦我更改了 css 文件中的溢出设置，两指滚动就可以在 iPad 上完美运行。
For iOS devices you need set overflow: auto; or the scrolling won't work. For my web apps I used fancybox to display iframes modally and once I change the overflow setting in the css file the two finger scroll worked perfectly on the iPad.
在尝试了（几乎）所有方法之后，我得出的结论是，将 GWT 窗口高度增加到 iframe.body.height 是让窗口/iframe 在 iPad 上滚动的唯一解决方案。希望这对将来的人有所帮助。
After trying (almost) everything, I have come to the conclusion that increasing the GWT window height to the iframe.body.height is the only solution for getting the window/iframe to scroll on iPad. Hopefully, this will help someone in future.
我对 GWT 还很陌生，但对我来说它是这样工作的：
在我的例子中，iframe 的父 div 有一个类 x-component。
我在我的 css 文件中添加了一个条目，如下所示：
.x-组件{-webkit-overflow-scrolling：触摸； 。
如果我不将这些条目设置为类，而是设置为 div 元素本身，它也能正常工作
希望有帮助
I´m pretty new to GWT, but for me it worked like this:
The parent-div of the iframe has a class in my case, x-component.
I made an entry to my css file like this:
.x-component{-webkit-overflow-scrolling: touch; overflow:auto;}
It works as well if I set these entries not to the class, but to the div-element itself.
Hope that helps