首页 > 语言 > JavaScript > 正文

基于jquery实现等比缩放图片

2024-05-06 16:11:23
字体:
来源:转载
供稿:网友
这篇文章主要给大家分享了一段基于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
});

 

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


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选