在加载到html之前获取高度和宽度图像答案

【问题标题】：get height and width image before loading in html在加载到html之前获取高度和宽度图像
【发布时间】：2015-07-12 19:38:15
【问题描述】：

我有图像的原始宽度和高度。我想根据原始图像大小和 div 大小找出图像在 div 中的缩放比例。例如图像大小为 400*1120，div 大小为 500*800.in这种情况下，加载该 div 后的图像大小是多少。这是图像的 css 代码：

img{
position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-height: 100%;
  max-width: 100%;
}

【问题讨论】：

请更清楚地描述您的问题。
在加载图像之前，我发送一个 ajax 并获取图像的原始高度和宽度。所以我想以原始图像的宽度和高度显示图像的缩略图。当图像大小大于 div 大小的图像时根据 div 大小缩放。我想知道当图像大小大于 div 大小时图像如何缩放

标签： jquery html css image

【解决方案1】：

如果您尝试的是在不扭曲图像的情况下适应比例，只需从图像中删除位置、左侧、顶部和变换属性并将它们应用到您的 div 容器。图片应该只将最大宽度和最大高度设置为 100%，它会起作用。

#yourcontainer
{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

img
{
    max-height: 100%;
    max-width: 100%;
}

【讨论】：