2

我有一个使用 DIV 动态创建的表。表格的每一行都有两个图像。我想将 div 的高度（表示特定行）设置为图像的高度，该高度大于该特定行中显示的两个图像。要显示的图像将始终更改，并且它们来自外部服务器。

如何设置我的 div 的高度以适应图像？

4

7 回答 7

3

如果您尝试动态调整表格中一行中的几个 div 的大小，则最好使用 html 表格并将每个图像放在 td 标记中。这将使 tr 标签为每个单元格中的图像相应地调整大小。

于 2008-10-11T16:43:18.520 回答
3 
  this.img = new Image();
  this.img.src = url;
  alert(this.img.width);

给出宽度，而

  var img = new Image();
  img.src = url;
  alert(img.width);

不..

不知道为什么。

于 2011-01-24T23:43:19.537 回答
1

你可以：

  1. 不指定div的高度，让它自动展开

  2. 加载图像后，请执行以下操作：

    document.getElementById("myDiv").height = document.getElementById("myImage").height

于 2008-09-20T03:15:52.300 回答
0

将它们预加载到 javascript 图像对象中，然后仅引用高度和宽度。

可能需要一些聪明的魔鬼才能在所有浏览器中工作......

function getSize(imgSrc){

    var aImg = new Image();

    aImg.src = imgSrc;

    aHeight = newImg.height;
    aWidth = newImg.width;

}
于 2008-09-20T03:13:56.423 回答
0

我们需要更多信息才能非常有用。您可以在页面加载后通过 Javascript ( info )获取图像的高度和宽度，然后您可以在加载后调整 div 的高度。否则，你真的很不走运，因为 HTML 本身没有任何东西。

如果您使用 PHP，则可以使用getimagesize()，如果您使用 PHP 动态构建站点，则可以使用它。其他语言也有类似的功能，但我们需要更多信息。

于 2008-09-20T03:17:28.397 回答
0

如果您希望浏览器根据图像的高度进行布局，则在它获取图像之前，您需要将该高度发送到浏览器的某个位置。这将需要一些服务器端的东西。最快的方法是直接插入到 html 中。更慢但更优雅的是使用 <script src=> 语句逐个图像地获取它，这些语句从一个特殊的 javascript 生成 cgi 中获取指令。（速度差异来自网络往返。）

如果您愿意在数据到达后调整大小，那就简单多了。要么在图像上添加一个 onload 处理程序，要么将它们粘贴在正常的 dom 中（例如，一个实际的表格，尽管您可以使用 div 和 css 来完成）并让布局引擎完成工作。

于 2008-10-12T05:12:42.440 回答
0

这个问题已经通过多种方式得到了回答，您还提出了附加问题“这不会让 UI 看起来很糟糕吗？”

这个问题的答案是肯定的。在大多数情况下，最好的做法是将 div 的高度设置为看起来不错的值，然后缩小图像以适应。这将使渲染速度更快，最终产品看起来更好、更专业。

但这只是我自己的看法。我没有经验数据来支持这一点。

于 2008-10-13T00:14:16.160 回答