CSS实现图片等比例缩放代码与jquery图片等比例缩放代码比较_行业新闻_公司动态_文章_盛夏 Senxnet

CSS实现图片等比例缩放代码与jquery图片等比例缩放代码比较

方法六 jquery 方法但是有个缺陷就是图片如果加载的慢就会导致其他的图片都无法等比例缩放。

如果jquery + 以上的 CSS 方法几乎堪称完美。本小者亲身测试体验后得出的结果。

/*!
* 计彩中国精彩你我
* jquery 库
*/
$(document).ready(function(){
//自动图片缩略
    $('.gicai_productlist').autoResize({height:113});
});   jQuery.fn.autoResize = function(options)
{
    var opts = {
        'width' : 185,
        'height': 113
    }
    var opt = $.extend(true, {},opts,options || {});
    width = opt.width;
    height = opt.height;
    $('img',this).each(function(){
        var image = new Image();
        image.src = $(this).attr('src');   if(image.width > 0 && image.height > 0 ){
            var image_rate = 1;
            if( (width / image.width) < (height / image.height)){
                image_rate = width / image.width ;
            }else{
                image_rate = height / image.height ;
            }
            if ( image_rate <= 1="" br="">                $(this).width(image.width * image_rate);
                $(this).height(image.height * image_rate);
            }
        }
    });
//其他方法

}

以上是计彩中国整理推荐给大家。

标签：