Question

下面的代码非常适合按高宽比调整图像大小，我还可以按宽度创建单独的函数。但我并不总是确定图像是否需要按高度或宽度缩小。

例如，如果图像需要调整大小的空间是100宽度和100高度，而图像是150乘90，那么它的宽度需要缩小。如果图像是80乘160，那么高度需要缩小。

所以我要问的是如何修改下面的代码，以便按宽高比缩小图像以适应宽度和高度的参数？感谢。

jQuery.fn.resizeHeightMaintainRatio = function(newHeight){
if (this.aspectRatio == undefined) 
this.aspectRatio = parseInt($(this).width() / $(this).height());
$(this).height(newHeight); 
$(this).width(newHeight * this.aspectRatio);
}

我已经再次编辑了代码，因为在进一步检查时，我的更新版本和Dan's似乎都没有正常工作。宽高比失去了，所以这是又一个。我已经尝试过一张图片，到目前为止一切都很好。在这里，

        jQuery.fn.resizeMaintainRatio = function(newHeight, newWidth){
            widthRatio = parseInt($(this).width() / newWidth);
            heightRatio = parseInt($(this).height() / newHeight);

            if(heightRatio > widthRatio)
            {

                this.aspectRatio = parseInt($(this).css("width") / $(this).css("height"));

                $(this).css("height", newHeight);
                $(this).css("width", newHeight * this.aspectRatio);

            }
            else{

                this.aspectRatio = parseInt($(this).css("height") / $(this).css("width"));

                $(this).css("width", newWidth);
                $(this).css("height", newWidth * this.aspectRatio);

            }

        }

再次注意：进一步使用后，上面的代码非常奇怪，请尝试这样做 - http://plugins.jquery.com/project/kepresize

Answer 1

以下代码将确定哪一侧需要缩放（使用非方形框，只需检查宽度与高度不起作用）并根据它进行缩放。

如果图像小于newWidth * newHeight框，它也会放大图像。如果您不希望它放大，我切换比率，检查宽度或高度是否> 1然后，然后才进行比例。

免责声明：代码尚未运行，但概念应该是正确的。

编辑已更新OP的修正。

jQuery.fn.resizeHeightMaintainRatio = function(newHeight, newWidth){
   widthRatio = parseInt($(this).width() / newWidth);
   heightRatio = parseInt($(this).height() / newHeight);
   if(widthRatio < 1 && heightRatio < 1){
      widthRatio = heightRatio;
      heightRatio = widthRatio;
   }
   if(widthRatio > heightRatio){
      $(this).width(newWidth); 
      $(this).height(newHeight / widthRatio);
   } else
   {
      $(this).height(newHeight); 
      $(this).width(newWidth / heightRatio);
   }
}

Answer 2

你必须检查$(this).width() > $(this).height() 如果为true，则调用该代码的宽度版本，否则调用该确切版本。

Answer 3

没有考虑复制和粘贴的数量呃！我也想知道这一点，我所看到的只是缩放宽度或高度的无数例子。谁会想要另一个溢出？！

调整宽度和高度，无需循环
不超过图像原始尺寸
使用正常工作的数学，即高度的宽度/宽高度，以及宽度的高度*宽高比，因此图像实际上可以上下缩放：/

应该直截了当地转换为javascript或其他语言

//////////////

private void ResizeImage(Image img, double maxWidth, double maxHeight)
{
    double srcWidth = img.Source.Width;
    double srcHeight = img.Source.Height;

    double resizeWidth = srcWidth;
    double resizeHeight = srcHeight;

    double aspect = resizeWidth / resizeHeight;

    if (resizeWidth > maxWidth)
    {
        resizeWidth = maxWidth;
        resizeHeight = resizeWidth / aspect;
    }
    if (resizeHeight > maxHeight)
    {
        aspect = resizeWidth / resizeHeight;
        resizeHeight = maxHeight;
        resizeWidth = resizeHeight * aspect;
    }

    img.Width = resizeWidth;
    img.Height = resizeHeight;
}

调整图像大小

3 个答案: