在 iframe 中显示图像

Question

我想在网页的 iframe 中显示图像。但是，问题是我无法将其扩展到其大小的 100%。

我想做的是以下。

• 在我的网页上有一个 iframe。
• 在 iframe 中调用图像。
• 将图像展开为全尺寸，作为反应，iframe 允许我滚动。
• 我的网页上没有任何滚动条

目前，这是我拥有的代码：

echo"<iframe name='graph' id='graph' src=$image style='position:absolute; top:0px; left:0px; height:100%;width:100%'></iframe>";

这样做的目的是，它使 iframe 出现在我的网页顶部，但仍然没有扩展到 100%。如果我删除位置：绝对：

echo"<iframe name='graph' id='graph' src=$image style='top:0px; left:0px; height:100%;width:100%'></iframe>";

我最终让它的宽度扩大到 100%，但就高度而言，它只有 3 个像素高，并且有一个滚动条可以滚动到底部。

我在网上搜索了一个修复程序，但我尝试过的都没有。有些人也提到改变 CSS，但无济于事......

编辑

我面临的另一个问题是图像在 Firefox 中被缩小。我需要单击 iframe 中的图像以将其扩展为完整大小。它虽然在 Chrome 和 IE 中正确显示。有解决办法吗？

Answer 1

将此添加到您的主页的 CSS：

body, html {
   height:100%   
}

Answer 2

您可以使用一些 JavaScript 来检测 iframe 内容的大小并调整 iframe 的大小。

Answer 3

容器（封闭的 div，如果您没有容器，则应该创建一个容器）似乎是限制 iframe 高度的原因。尝试将容器的高度设为 100%。

Answer 4

你的问题是你直接嵌入了一个图片资源。

这永远不会按照您想要的方式工作。图像始终是原始大小。

您需要将 iframe 的 src 属性设置为一个单独的 HTML 文件，该文件带有自己的 body，环绕图像。 然后你可以使用 CSS 给它 100% 的宽度和/或高度。

Answer 5

如果您可以在本地访问图像并且可以使用 php GD 函数...

$img_rsrc = imagecreatefromjpeg($path_to_image);
// or imagecreatefrompng, imagecreatefromgif, etc, depending on the type of your image
$height = imagesy($img_rsrc);
$width = imagesx($img_rsrc);
imagedestroy($img_rsrc);

然后根据高度和宽度设置 iframe 的大小（以像素为单位）。您可能需要在高度和宽度上增加一点以考虑边距。

Answer 6

使用下面的代码来显示图像。

<iframe frameborder="0" scrolling="no" width="100%" height="100%"
   src="../images/eightball.gif" name="imgbox" id="imgbox">
   <p>iframes are not supported by your browser.</p>
</iframe><br />


<a href="../images/redball.gif" target="imgbox">Red Ball</a><br />
<a href="../images/floatingball.gif" target="imgbox">Floating Ball</a><br />
<a href="../images/eightball.gif" target="imgbox">Eight Ball</a>