跨浏览器问题（iframe大小调整） [英] Cross browser issue (iframe sizing)

问题描述

我正在其中一个页面的 iframe 中显示来自我自己的外部站点的页面。一切都很好，除非在 Opera 中观看时减小了浏览器窗口的大小（不是宽屏），当 iframe 缩小并压缩内容。它可以在宽屏（最大化浏览器窗口）中运行，并且在 IE7，Firefox，Chrome 和 Safari 中可以正常使用减小窗口大小。

I am displaying pages from an external site (that I own) in an iframe in one of my pages. It's all fine except when viewed in Opera with the browser window size reduced (not widescreen), when the iframe shrinks and squashes the content. It works in widescreen (maximize browser window), and is OK in IE7, Firefox, Chrome and Safari in maximize and reduced window size.

我已经在HTML中设置了框架尺寸，并将 iframe 嵌套在 div 大于通过CSS的 iframe 。

I have set the frame dimensions in the HTML and have nested the iframe in a div which is larger than the iframe via the css.

这是Opera特有的错误，还是我可以做些什么？

Is this a peculiar bug to Opera or is there something I can do about it?

推荐答案

我们在<$上遇到了类似的问题虽然在IE6中，但在我们的Web应用程序主页上可以调整c $ c> iframe 的大小。解决方案是捕获 window.onresize 事件并调用JavaScript函数以适当调整 iframe 的大小。 content 是我们要调整大小的 iframe 的名称。还要注意，我们使用的是ASP.Net AJAX的 $ get ，它转换为 document.getElementById（）

We had a similar issue with iframe sizing on our web app main page, although in IE6. The solution was to trap the window.onresize event and call a JavaScript function to appropriately size the iframe. content is the name of the iframe we want sized. Also note that we are using ASP.Net AJAX's $get which translates to document.getElementById()

window.onresize=resizeContentFrame;
resizeContentFrame();

function resizeContentFrame() {
    setFrameHeight($get('content'));
}

function setFrameHeight(f) {
    if(isDefined(f)) {
        var h=document.documentElement.scrollHeight;
        h-=(HEADER_HEIGHT+CONTENT_PADDING+5);
        f.style.height=h+'px';
    }
}

这篇关于跨浏览器问题（iframe大小调整）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！