iOS（iPad）内容裁剪问题上的iframe

Question

我在寻找正确的确保在ipad/iOS5上的iframe滚动后动态显示的内容可见。

哦Iframes和iPad - 多么美妙的老chesnut你。我知道：

• 的iPad展开的iframe内其内容的全高（几乎就像是使用HTML5的“seamless”属性，但并不完全，因为它没有继承父样式或事件） 。奇怪的是，很多人都很烦，但是确实如此。
• <iframe height="100%">因此，无用的，因为它尺寸其内容不容器

• 我需要换我的iframe在一个div - 一拉

  <div id="wrapper" style="-webkit-overflow-scrolling:touch;overflow:auto;"> 
  <iframe width="100%" height="100%" src="about"blank"></iframe> 
  </div> 
  

• 或者引进一些trickery设置滚动帧的位置（我认为是基于this article提到的技巧）

我的问题是，内容是动态SH拥有iframe主体（例如， jquery选项卡，手风琴等）可能会导致浏览器在页面的显示范围内裁剪内容。

E.g.如果我的“选项卡”在iframe中的可见视口中最下方，并且我执行双指滚动（或实现单指scrollTop黑客），那么在内容滚动到视图中之后，它的一些内容先前未绘制仍未提取。再次单击第二个制表符会导致内容出现，就好像该页面不会绘制屏幕外的内容一样。在此之后，如果我向后滚动到页面的顶部，则不会为页面的开始绘制内容（之前可见）。使用双指滚动向上和向下滚动页面几次即可解决问题。

我读过this article，表示问题已修复。但它似乎并不完全固定;仍然没有解决这个问题，因为你必须将你的iframe包装在div中，并将滚动条放在该div上，桌面浏览器可能会显示双滚动条，这取决于它们如何解释overflow:auto。

p.s.我在iframe的内部和外部使用HTML5样板页，并使用正确的元视口设置。