当前位置：首页 > 资讯 > 技术文档

基于jquery实现等比缩放图片

时间：2022-02-20 16:12 编辑：来源：阅读：
扫一扫，手机访问

摘要：基于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

});

代码很简洁，使用起来也很简单，小伙伴们直接使用即可

全部评论(0)

上一篇：AngularJS基础 ng-mouseleave 指令详解
下一篇：jquery实现图片按比例缩放示例

资讯排行榜
更多>>