动态调整图像大小并保持纵横比

Question

我需要调整图片大小以在不同尺寸的不同页面上显示，保持原始图像的宽高比。

我可以以编程方式执行此操作，还是需要预先加载不同大小的图像

Answer 1

如果仅设置图像的宽度或高度，并且未指定其他尺寸，浏览器将按比例缩放图像，同时保持其纵横比。

工作演示：http://jsfiddle.net/jfriend00/NRLQ5/

Answer 2

我认为此链接可以帮助您： http://www.dzone.com/snippets/c-resize-image-while。当然，您可能需要根据自己的需要调整逻辑。

Answer 3

如果您使用的是Css3，则可以使用transform：scale（scalefactor）

Answer 4

您可以使用System.Web.Helpers程序集中的WebImage类。 它提供了一种方法Resize，它允许您调整保持纵横比不变

public WebImage Resize(
    int width,
    int height,
    bool preserveAspectRatio,
    bool preventEnlarge
)

除此之外，您还可以使用文件路径，流或字节数组创建WebImage实例，并轻松添加水印。

WebImage image = new WebImage(Server.MapPath("~/upload/my_image.png"));
WebImage image_small_1 = image.Resize( Convert.ToInt32(image.Width / 2), Convert.ToInt32(image.Height / 2), true, true );

您可以将图像保存到磁盘，或者如果环境允许将其存储在缓存中

image_small_1.Save(Server.MapPath("~/upload/my_image_small_1.png"), "png", true);

byte[] to_be_cached = image_small_1.GetBytes("png");