将Div调整为iFrame

Question

我正在开发一个响应式设计，其中包含用于加载Wordpress博客的iFrame。该页面在所有浏览器上都可以完美地加载，但是本机iOS Safari，但它们在Safari中根本不加载。使用iPhone的同事建议加载，但不要滚动，我知道这是一个简单的元更改，但我的测试平台设备（iPod touch）即使在iOS6固件更新后也不会加载它们（和因此，我必须设计好像iFrames根本不加载）。我读到的最好的替代建议是将内容加载到div中。

内容很好地加载到div中。现在的挑战是div不会调整大小，动态调整大小是页面的要求（页面有一个jQuery slideUp标题，内容在滑动时调整）。因此，iFrame会调整大小，但不会在iOS中加载，并且div会加载，但不会在任何浏览器中调整大小。这是彻底被黑客攻击的代码：

HTML

<div id="iFrame1"></div>

CSS

#iFrame1 {
 position:absolute; /* because I am trying everything */
 display:block; /* Yes, divs are block inherently, this is hacked code */
 float: left; /* there are two iframe divs */
 overflow-y: auto;
 height: 1px; 
 width: 45%;

}

的JavaScript

function resizeIFrames(){
document.getElementById('iFrame1').style.height = document.getElementById("content").clientHeight - 150 + "px";
document.getElementById('iFrame1').style.minHeight = document.getElementById("content").clientHeight - 150 + "px";}

我对所有符合跨浏览器标准的建议持开放态度。我将使用iFrames，div，表，等等。引导我，我会倾听。