基于jquery实现等比缩放图片

260 阅读 0 评论 172 点赞

我是靠谱客的博主坚强可乐，最近开发中收集的这篇文章主要介绍基于jquery实现等比缩放图片，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

基于jquery的图片尺寸调整

resize.js

复制代码代码如下:

$(window).bind("load", function() {

    // IMAGE RESIZE

    $('#product_list img').each(function() {

        var maxWidth = 120;

        var maxHeight = 120;

        var ratio = 0;

        var width = $(this).width();

        var height = $(this).height();

        if(width > maxWidth){

            ratio = maxWidth / width;

            $(this).css("width", maxWidth);

            $(this).css("height", height * ratio);

            height = height * ratio;

        }

        var width = $(this).width();

        var height = $(this).height();

        if(height > maxHeight){

            ratio = maxHeight / height;

            $(this).css("height", maxHeight);

            $(this).css("width", width * ratio);

            width = width * ratio;

        }

    });

    //$("#contentpage img").show();

    // IMAGE RESIZE

});