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

Question

我的博客文章存在于600px宽的容器中。当我的图像宽度超过600px时，我通过CSS（.post img {max-width: 600px}）

调整大小

我希望用户能够点击这些已调整大小的图片并在灯箱中查看完整尺寸的版本，但为了做到这一点，我需要在Javascript中检测哪些图像已经调整大小（因为我不想要灯箱中显示全尺寸内嵌的灯箱图片

Answer 1

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

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

Answer 2

我不相信你可以说是因为JS会读取它在DOM中的图像。但是，如果在JS中设置max-width：

Just Psuedocode

onload
{
    if (img.width > 600px)
    {
        img.style = max-width: 600px;
        img.lightbox();
    }
}