Jquery 垂直图像的纵横比

我遇到的问题是，有时垂直图像没有得到纵横比，它会拉伸，但其他一些垂直图像得到的纵横比很好，适合容器

两个垂直图像没有获得高度，因为它的容器纵横比its=NaN

代码如下：

function Gallery(selector){
    this.add_module = function(type, image){

        var portrait_text = image.next('.portrait_text');

        var container = $('<div />' , {
            'class' : 'gallery_container'
        }).append(image).append(portrait_text);

        if(type == 'horizontal'){
            var h_ar = image.attr('height') / image.attr('width');
            var c_width = selector.width();
            var c_height = selector.width()*h_ar
            container.css({
                'width' : c_width -10,
                'height' : c_height
            })
        }
        if(type == 'vertical'){
            var c_width = v_width;
            var c_height = v_height
            container.css({
                'width' : Math.floor(v_width) -5,
                'height' : v_height
            })
        }
        container.css({
            'float' : 'left'
        })
        container.find('img').attr({
            'width' : '100%',
            'height' : '100%'
        })
        container.attr('ar' , c_height/c_width)
        container.appendTo(selector);

        //container.children('img').fitToBox();
    }

    this.resized = function(){
        //console.log(sel)
        $('.gallery_container').each(function(){
            if($(this).attr('ar') >= 1){ // vertical
                $(this).css({
                    'width' : Math.floor(sel.width()/2) -5,
                    'height' : sel.width()/2 * $(this).attr('ar')
                })
            }else{ // horizontal
                $(this).css({
                    'width' : sel.width() -10,
                    'height' : sel.width() * $(this).attr('ar')
                })
            }
        })
    }
    var _this = this;
    var gutter = 0;
    // start vars for counting on vertical images
    var v_counter = 0;
    var w_pxls = 0;
    var h_pxls = 0;
    // iterates through images looking for verticals
    selector.children('img').each(function(){
        if($(this).attr('width') < $(this).attr('height')){
            v_counter++;
            h_pxls += $(this).attr('height');
            w_pxls += $(this).attr('width');
        }
    })
    // calculates average ar for vertical images (anything outside from aspect ratio will be croped)
    var h_avrg = Math.floor(h_pxls/v_counter);
    var w_avrg = Math.floor(w_pxls/v_counter);
    var v_ar = h_avrg/w_avrg;
    var v_width = Math.floor((selector.width())/2);
    var v_height = v_width*v_ar;
    var sel = selector;
    selector.children('img').each(function(){
        if(parseInt($(this).attr('width')) > parseInt($(this).attr('height'))){
            _this.add_module('horizontal', $(this));
        }else{
            _this.add_module('vertical', $(this));
        }
    })
    $(window).bind('resize' , _this.resized);
}

var gallery = new Gallery($('#gallery_images_inner'));

功能库（选择器）{
this.add_module=函数（类型、图像）{
var RATIATE_text=image.next（'.RATIATE_text'）；
变量容器=$（''{
“类”：“库容器”
}).append（图像）.append（纵向\文本）；
如果（类型=‘水平’）{
var h_ar=image.attr（'height'）/image.attr（'width'）；
var c_width=selector.width（）；
var c_height=selector.width（）*h_ar
container.css({
“宽度”：c_宽度-10，
“高度”：c_高度
})
}
如果（类型==“垂直”）{
var c_width=v_width；
变量c_高度=v_高度
container.css({
“宽度”：数学地板（v_宽度）-5，
“高度”：v_高度
})
}
container.css({
“float”：“left”
})
container.find（'img'）.attr({
“宽度”：“100%”，
“高度”：“100%”
})
容器属性（'ar'，c_高度/c_宽度）
container.appendTo（选择器）；
//container.children（'img'）.fitToBox（）；
}
this.resized=函数（）{
//控制台日志（sel）
$（'.gallery_container'）。每个（函数（）{
如果（$（this.attr（'ar'）>=1）{//vertical
$（this.css）({
“宽度”：数学地板（选择宽度（）/2）-5，
'height'：sel.width（）/2*$（this.attr（'ar'））
})
}else{//水平
$（this.css）({
“宽度”：选择宽度（）-10，
“高度”：sel.width（）*$（this.attr（'ar'））
})
}
})
}
var_this=这个；
var=0；
//启动变量以在垂直图像上计数
var v_计数器=0；
var w_pxls=0；
var h_pxls=0；
//在图像中迭代查找垂直方向
selector.children（'img'）.each（function（）{
if（$（this.attr（'width'）<$（this.attr（'height'））{
v_计数器++；
h_pxls+=$（this.attr（'height'）；
w_pxls+=$（this.attr（'width'）；
}
})
//计算垂直图像的平均ar（宽高比以外的任何内容都将被忽略）
var h_avrg=数学地板（h_pxls/v_计数器）；
var w_avrg=数学地板（w_pxls/v_计数器）；
var v_ar=h_avrg/w_avrg；
var v_width=Math.floor（（selector.width（））/2）；
var v_高度=v_宽度*v_ar；
var sel=选择器；
selector.children（'img'）.each（function（）{
if（parseInt（$（this.attr（'width'））>parseInt（$（this.attr（'height'）））{
_this.add_模块（'horizontal'，$（this））；
}否则{
_this.add_模块（'vertical'，$（this））；
}
})
$（window.bind（'resize'），\u this.resized）；
}
var gallery=新画廊（$（“#画廊(图片)内部”）；

---

知道为什么会这样吗？

不要将图像高度设置为100%，将高度设置为

auto

，这样图像就可以根据需要变高以保持比例

问题在于：

container.find('img').attr({
    'width' : '100%'
})

---

你为每个链接提供了相同的URL:）是的，我注意到了，我已经更改了：）谢谢（我用高度自动更新了测试）它解决了高度问题，但它一直在说它的ar=NaN。你知道为什么吗？对于其他垂直，它获得纵横比，ar错误的问题是，它不能适合每行两个垂直图像……这可能是因为您正在使用var

h_ar=image.attr（'height'）/image.attr（'width'）计算
ar
值由于图像没有这些设置中的一个，您的计算将导致NaN。但其他垂直图像都没有设置NaN，这很奇怪尝试以下操作：更改此行
var h_ar=image.attr（'height'）/image.attr（'width'）对于var
h_ar=image.get（0）.height/image.get（0）.width