当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 基于jquery实现等比缩放图片

基于jquery实现等比缩放图片

2019年03月27日  | 移动技术网IT编程  | 我要评论

基于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
});

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

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网