iframe 在 IOS 上浮动
Iframe floating around on IOS
我有一个用 iframe-container div 包裹的 iframe，它从右边占据了 25% 的屏幕，所有元素都在 iframe 内。
iframe 中有一个文本框输入字段，触摸后，所有元素都正常运行，并且 windows 根据 IPAD 的键盘进行调整，但是在我开始输入的那一刻，即任何字符正在添加到文本输入中，iframe-container 的整个布局向左移动，然后在输入更多字符后完全消失。
参考下图：
第一个屏幕（这是一直想要的UI）
屏幕二（输入任何字符后搞砸 UI）
即使添加更多字符，此布局也会消失。
我通过 IOS 设备解决了 iframe 的几个已解决问题，并从中遵循了一些概念和解决方案。
- 本例中的 iframe 没有添加任何滚动条。正在滚动 iframe 中的 div
- 还尝试将
-webkit-overflow-scrolling: touch; 添加到可滚动 div 中，但这也没有帮助。
- 使用 VH 作为高度，尝试删除它们并使用
PX 也没有运气。
注意：很多 jQuery 被用于 UI 调整，不是特别针对 iframe，十字按钮基本上切换 iframe-wrapper div（简单的隐藏和显示).
谢谢！！
编辑
我找到了问题所在，现在我需要解决方案。
Safari 自动添加 background-position 属性 并将其设置为 Initial，手动覆盖为 no-repeat 可解决问题。
我尝试为 background-position 添加 jQuery css 属性，但我想它不知何故没有被应用。
这很奇怪，但我发现 0 属性 不工作，当我添加 left 和 top 而不是 bottom: 0 时，一切都很好！！
我有一个用 iframe-container div 包裹的 iframe，它从右边占据了 25% 的屏幕，所有元素都在 iframe 内。
iframe 中有一个文本框输入字段，触摸后，所有元素都正常运行，并且 windows 根据 IPAD 的键盘进行调整，但是在我开始输入的那一刻，即任何字符正在添加到文本输入中，iframe-container 的整个布局向左移动，然后在输入更多字符后完全消失。
参考下图：
第一个屏幕（这是一直想要的UI）
屏幕二（输入任何字符后搞砸 UI）
即使添加更多字符，此布局也会消失。
我通过 IOS 设备解决了 iframe 的几个已解决问题，并从中遵循了一些概念和解决方案。
- 本例中的 iframe 没有添加任何滚动条。正在滚动 iframe 中的 div
- 还尝试将
-webkit-overflow-scrolling: touch;添加到可滚动 div 中，但这也没有帮助。 - 使用 VH 作为高度，尝试删除它们并使用
PX也没有运气。
注意：很多 jQuery 被用于 UI 调整，不是特别针对 iframe，十字按钮基本上切换 iframe-wrapper div（简单的隐藏和显示).
谢谢！！
编辑
我找到了问题所在，现在我需要解决方案。
Safari 自动添加 background-position 属性 并将其设置为 Initial，手动覆盖为 no-repeat 可解决问题。
我尝试为 background-position 添加 jQuery css 属性，但我想它不知何故没有被应用。
这很奇怪，但我发现 0 属性 不工作，当我添加 left 和 top 而不是 bottom: 0 时，一切都很好！！