获得缩放图像的高度

Question

我正在获得图片的原始尺寸。通过max-width:473px;将css应用于图像，并且浏览器会自动调整高度。但是在图片load event内部，我正在获得原始的非缩放尺寸。

因此，基本上原始图片尺寸为506x337，并且在css规则图片变为473x315之后。如何在315px内获得load event高度？

更新

有用于测试的代码段： http://jsfiddle.net/CXNan/

Answer 1

这将为我提供您在评论@问题中发布的元素的计算高度。

window.getComputedStyle(document.getElementById("idOfYourImage"), null).getPropertyValue("height")

正如你们已经注意到的那样，不是跨浏览器（不是IE或旧的东西）。

---

<强>更新

我发现了这个getComputedStyle for IE但是还没有测试它。 可能可以正常，因为正如http://ie.microsoft.com/testdrive/HTML5/getComputedStyle/所说，旧的IE API被称为currentStyle，这是＆＃34; getComputedStyle for IE＆＃34;使用

currentStyle唯一的问题是getComputedStyle总是会返回一个像素值，currentStyle会返回原始值（因此{c}上的width:50%将返回50％，而不是像素大小为父母的50％。）

Answer 2

将最大宽度除以宽高比，您将获得缩放高度。请注意，如果图像小于最大宽度，则不会进行缩放。像这样：

var height = img.width > 473 ? 473 / (img.width/img.height) : img.height;

Answer 3

您也可以使用

this.offsetHeight

见the fiddle。它包含只读像素大小，请参阅the reference。它在MSIE中受支持，并且应该是跨浏览器可靠的。