1

我有一个包含两包图像的页面(大的和小的,比如 10-30 个),它们的大小必须动态调整为当前浏览器窗口的大小,然后由另一个函数处理。我知道在浏览器中调整大小通常是个坏主意,但服务器上的需求+遗留代码也是如此。站点使用 JQuery。

代码(缩短的)如下所示:

imageResizeBox(imgSmallHeight, '.box img'); // resize images to some height, parameters are size and selector
imageResizeBox(imgBigHeight, '.imagebig img'); // resize other images to another     height
processImages(); // process both packs of images (do positioning based on new dimensions)

这是调整大小功能:

function imageResizeBox(size, selector) {
var max_size = size;


$(selector).each(function (i) {
    if (this.complete) {
        resizeImg(this);
    } else {
        $(this).load(function () {
            resizeImg(this);
        });
    }
});

function resizeImg(img) {
    if ($(img).height() > $(img).width()) {
        var h = max_size;
        var w = Math.ceil($(img).width() / $(img).height() * max_size);
    } else {
        var w = max_size;
        var h = Math.ceil($(img).height() / $(img).width() * max_size);
    }
    $(img).css({
        height:h,
        width:w
    });
}

}

我需要在浏览器中完成前两个功能后调用 processImages() 函数(图像大小调整完全完成),否则定位不正确。

4

1 回答 1

0

在里面调用你的代码

$(document).ready(**call your code here**);

加载所有图像后准备运行,请参阅规范http://api.jquery.com/ready/

于 2012-05-23T09:42:18.507 回答