Javascript 适用于具有两个图像的框

我正在使用jquery进行调整大小的工作，没有css

我遇到的问题是，调整大小对图像的效果很好，但我不能让它将两个图像放在同一行上，就像设计一样。如果图像是水平的，它将是每行一个，但如果它是垂直的，它应该安排每行两个，调整大小的工作都在这两个方面，你知道如何实现这一点吗

这是我的剧本：

    $('.gallery_item').each(function(){
        $('.gallery_img').each(function(){
            var ww = $(window).width() - 60 - 230;
            var wh = $(window).height() - 60;
            var iar = $(this).attr('height') / $(this).attr('width');
            var war = wh / ww;
            if(iar <= war){
                $(this).attr("width" , ww);
                $(this).attr("height" , ww * iar);
            }else{
                $(this).attr("height" , wh);
                $(this).attr("width" , wh / iar);
            }
            $('.gallery_item').css({
                'width' : $(this).attr('width'),
                'height' : $(this).attr('height'),
                'padding-bottom' : 0
            });
        });
    })

    $(window).bind('resize' , function(){

    $('.gallery_item').each(function(){
        $('.gallery_img').each(function(){
            var ww = $(window).width() - 60 - 230;
            var wh = $(window).height() - 60;
            var iar = $(this).attr('height') / $(this).attr('width');
            var war = wh / ww;
            if(iar <= war){
                $(this).attr("width" , ww);
                $(this).attr("height" , ww * iar);
            }else{
                $(this).attr("height" , wh);
                $(this).attr("width" , wh / iar);
            }
            $('.gallery_item').css({
                'width' : $(this).attr('width'),
                'height' : $(this).attr('height'),
                'padding-bottom' : 0
            });
        });
    })

    });

和我的标记：

                    <div class="gallery_item">
                        <img class="gallery_img" src="img/gallery0.jpg" alt="gallery0" width="850" height="567">
                        <img class="gallery_img vertical_img" src="img/gallery1.jpg" alt="gallery1" width="380" height="570">
                        <img class="gallery_img vertical_img" src="img/gallery2.jpg" alt="gallery2" width="382" height="570">
                    </div>

我尝试过使用float:left-on.vertical\u img，但运气不佳。

使用display:inline；打开。垂直\u img应将这两个图像放在同一条线上。但是，如果它们的组合宽度大于容器的宽度，则它们将显示在不同的行上

---

您的container div.gallery_项仅为250px宽，因此无法正常工作。您的大图像实际上超出了此容器的边界。此容器的宽度必须等于或大于两个图像的宽度。

为什么不将图像放在div中，然后浮动块元素。IMG标记是内联块。是的，我正在尝试获取图像的宽度，脚本是否错误？您的脚本正在将容器的宽度设置为最后一个较小图像的宽度（根据其外观）。$”。库_项'.css{'width'：$this.attr'width'…正在将.gallery_项目容器的宽度设置为.gallery_img图像的宽度-当它在其中循环时，会将其设置为第一个图像的宽度，第二个图像的宽度，然后将其设置为循环中最终图像的宽度，这意味着容器将始终等于大小宽度和高度一种方法是比较高度。在循环外部，放置var imgWidth=0；，并在循环内部添加一个检查：if$this.outerWidth>imgWidth{imgWidth=$this.outerWidth；}。这样，最后一个imgWidth变量将在循环结束时包含最宽的图像宽度。然后，您可以在循环外设置容器宽度-以便只设置一次，而不设置每个图像的宽度。您是否已使其正常工作？如果是，请将此标记为已接受的答案？如果不是，我应该能够帮助您解决问题塔克，塔克！