用于将一组图像调整为给定区域(不是高度或宽度)的 jQuery 函数 [英] jQuery function to resize a set of images to a given area (not height or width)

问题描述

我正在尝试编写一个 jQuery 函数，该函数将根据指定区域调整一组图像的大小，而不仅仅是最大高度或宽度.

I'm trying to write a jQuery function that will resize a set of images according to a specified area, rather than simply a max height or width.

这里有一个类似的问题:按区域调整图像大小，但我想让它在 jquery 中工作并同时处理多个图像

There's a similar question here: resize image by area, but I'd like to get it working in jquery and with multiple images at the same time

这是我目前正在使用的:http://jsfiddle.net/szSE5/21/ — 目前它没有按照我的预期运行.

Here's what I'm currently working with: http://jsfiddle.net/szSE5/21/ — it's not functioning the way I intended at the moment.

推荐答案

这个怎么样:

jQuery.fn.resizeImgByArea = function(avgDimension){
    var $this = $(this),
        oldW = $this.width(),
        oldH = $this.height(),
        RatiO = new Number(oldW/oldH),
        newH = new Number(Math.round(Math.sqrt(avgDimension/RatiO))),
        newW = new Number (Math.round(newH * RatiO));
    $this.css({
        width: newW + 'px',
        height: newH + 'px'
        });


}

$(document).ready(function() {
    $('#images img').each(function(){$(this).resizeImgByArea(10000)});
});

这篇关于用于将一组图像调整为给定区域(不是高度或宽度)的 jQuery 函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！