jquery与否跨浏览器兼容iframe调整大小（IE，Chrome，Safari，Firefox）

这是我的问题。我一直在寻找一个跨浏览器iframe调整大小的代码来使用，我只是找不到一个。我所见过的所有浏览器都有问题。这是我正在做的。我正在加载一个iframe到jquery工具叠加页面中。这iframe将加载页面的内容（在同一个域名，所以不需要担心跨域）。当用户点击该表单上的一个动作时，iframe将再次需要调整大小（当iframe增加时，我可以使用它，但iframe减少时不会）。jquery与否跨浏览器兼容iframe调整大小（IE，Chrome，Safari，Firefox）

我有一个是包含在具有这种功能

$(window).load(function(){ 
    parent.adjust_iframe(); 
});

该函数然后调用iframe父页面的功能，像这样一个js文件：

function adjust_iframe() { 

    //i have tried both body and html and both dont work in IE 
    var h = $("#overlayFrame").contents().find("body").height(); 
    if(h==0) 
    h="500"; 
    else 
    h=h+3; 

    $("#overlayFrame").css({'height': h}); 
    window.scrollTo(0,0); 

}

上面的代码工作正常Chrome和Firefox，但不在IE中。

这里有什么帮助吗？我真的需要一个跨浏览器兼容的轻量级解决方案，不涉及一些不支持的重型jquery插件。

谢谢！

来源

2012-03-26 Scoota P

尝试

$(window).load(function(){ 
    var bodyHeight = $('body').height(); 
    parent.adjust_iframe(bodyHeight); 
});

和

function adjust_iframe(newHeight) { 

    //i have tried both body and html and both dont work in IE 
    if(newHeight == 0) { 
     newHeight = 500; 
    } else { 
     newHeight += 3; 
    } 

    $("#overlayFrame").css({'height': newHeight}); 
    window.scrollTo(0,0); 
}

因为这个问题可能是该页面无法访问的I帧内容..

来源

2012-03-26 19:24:54

我有两个建议：

当你正在设置CSS高度，明确告诉它的像素。

$("#overlayFrame").css({'height': h + 'px'});

当你的iframe代码调用parent.adjust_iframe时，发送当前宽度/高度。

parent.adjust_iframe($('body').height());

奖励建议：做一点调查，并告诉我们什么版本的IE以及为什么它不起作用。在那里放置一些警报，并确定高度是否得到派生等。

来源

2012-03-26 19:25:59

我做了警报，并在IE8我得到一个警告说，高度是150.这是调整前的iframe的原始大小 – 2012-03-26 22:28:11

-1

我搜索了我的存档文件并找到了设置iframe窗口的新大小的脚本。它正在使用IE6，FF，...

/** 
* Parent 
*/ 
<iframe id="myframe" name="myframe" ...> 

<script type="text/javascript"> 
var iframeids=["myframe"]; 
if (window.addEventListener) { 
    window.addEventListener("load", resizeCaller, false); 
}else if (window.attachEvent) { 
    window.attachEvent("onload", resizeCaller); 
} else { 
    window.onload=resizeCaller; 
} 
var iframehide="yes"; 
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]; 
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 20 : 0; 
function resizeCaller() { 
    var dyniframe=new Array(); 
    for (i=0; i<iframeids.length; i++){ 
    if (document.getElementById) 
     resizeIframe(iframeids[i]); 
    if ((document.all || document.getElementById) && iframehide=="no"){ 
     var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i]); 
     tempobj.style.display=""; 
    } 
    } 
}; 

function resizeIframe(frameid){ 
    var currentfr=document.getElementById(frameid); 
    if (currentfr && !window.opera){ 
    currentfr.style.display=""; 
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) 
     currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight; 
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) 
     currentfr.height = currentfr.Document.body.scrollHeight; 
    if (currentfr.addEventListener) 
     currentfr.addEventListener("load", readjustIframe, false); 
    else if (currentfr.attachEvent){ 
     currentfr.detachEvent("onload", readjustIframe); 
     currentfr.attachEvent("onload", readjustIframe); 
    } 
    } 
}; 
function readjustIframe(loadevt) { 
    var crossevt=(window.event)? event : loadevt; 
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement; 
    if (iframeroot)resizeIframe(iframeroot.id); 
}; 

function loadintoIframe(iframeid, url){ 
    if (document.getElementById)document.getElementById(iframeid).src=url; 
}; 
</script> 

/** 
* child iFrame html 
*/ 
<body onResize="resizeIE()">

来源

2012-03-26 19:28:48 JercSi

jquery与否跨浏览器兼容iframe调整大小（IE，Chrome，Safari，Firefox）

回答

相关问题