Question

我正在研究我们正在尝试采用的项目，并将模板图像调整为各种分辨率。例如，如果以800px宽度（800x600）和1024px宽度或更大的宽度查看网站，则应以相同的质量查看图像大小。我已经考虑过为这个模板的每个范围使用带有3种类型图像的精灵，但我正在寻找其他想法，php gd也许吧？任何python解决方案？

Answer 1

嗯，为了调整大小，使用GD当然会更好......但我认为已编入索引。这样你就有了一个上传脚本，可以自动生成其他尺寸的图像，并将它们保存在某个地方。

然而，重要的是你是否有更多的磁盘空间或性能......如果有很多人查看这些图像，性能会变差。如果您有大量这些图像，磁盘空间会变得更糟。

Answer 2

Python Imaging Library会为您提供动态调整大小，处理等功能。

Answer 3

如果要调整一组已知的分辨率，可以只调整一次图像并存储它们。

如果您需要调整任何可能的分辨率，您需要一个库来为您完成。在PHP中，GD或ImageMagik都很好。

如果这样做，您可能希望为最常见的分辨率添加缓存。这将占用更多的磁盘空间，但每次都会节省重新计算所有图像的成本。

请注意，虽然可能很难检测到真正的分辨率。如果调整浏览器窗口的大小，您认为屏幕的分辨率可能不是用户可以看到的实际分辨率。如果他们打开了工具栏或侧边栏，也会发生同样的情况。

Answer 4

为什么不使用JavaScript调整客户端上的图像大小？

<head>
<script>
function resize() {
    ww = window.innerWidth
    wh = window.innerHeight
    photo = document.getElementById("photo")
    // You probably wouldn't actually make the image fill the window, you'd pick
    // some appropriate size.
    photo.setAttribute("width", ww)
    photo.setAttribute("height", wh)
}
</head>
<body onload="resize()" onresize="resize()">
<img id="photo" src="photo.jpg">

Answer 5

获取内部窗口宽度非常困难，因为不同的浏览器使用不同的变量。但是，这是我在我的网站上使用的。它相当可靠地获得内部窗口宽度，然后设置图像宽度/高度。修改此代码以设置所需图像的src应该不会太难。

function set_image_sizes(){
    if (window.innerHeight != undefined) {
        height = window.innerHeight;
        width = window.innerWidth;
    } else if (document.documentElement.clientHeight > 0) {
        height = document.documentElement.clientHeight;
        width = document.documentElement.clientWidth;
    } else {
        height = document.body.clientHeight;
        width = document.body.clientWidth;
    }

    $('#image').css('height', height);
    $('#image').css('width', width);

}

动态图像调整大小

5 个答案: