javascript - 检测图像何时在 CSS 中调整大小

Question

我的博文存放在一个 600 像素宽的容器中。当我的图片宽度超过 600 像素时，我会通过 CSS 调整它的大小 (.post img {max-width: 600px})

我希望用户能够单击这些调整大小的图像并在灯箱中查看完整尺寸的版本，但为此我需要在 Javascript 中检测哪些图像已被调整大小(因为我不想到在帖子中显示全尺寸内联的灯箱图像)

Answer 1

您可以检查图像元素的 width 属性以获取图像的渲染宽度。如果是600，图像最有可能被缩小。但是，图像最初也可能正好是 600 像素宽。

如果浏览器支持新的 HTML 5 naturalWidth属性，您可以获得原始图像宽度(以像素为单位)并将其与 clientWidth 的值进行比较。