将imgs的宽度变量计算为div答案

【问题标题】：Calculate width variable of imgs into a div将imgs的宽度变量计算为div
【发布时间】：2012-09-27 13:01:13
【问题描述】：

我想用 Jquery 做一个轮播，并且 img 具有可变宽度。

我知道如何用 FIX 宽度计算多个 img，但我不知道如何用 VARIABLE 宽度计算分配 div（在本例中为 sub_container）。

这是一个例子：

    <div id="container">
          <div id="sub_container" style="width:WIDTH FROM VARIABLE WIDTH OF IMAGES">          
             <img id="#number" width="200px" src="#">
             <img id="#number" width="240px" src="#">
             <img id="#number" width="150px" src="#">
             <img id="#number" width="500px" src="#">
          </div>
    </div>

记住：容器的宽度取自窗口/浏览器的宽度。

你能帮帮我吗？：/

非常非常感谢！ :(

【问题讨论】：

标签： jquery wordpress variables width

【解决方案1】：

你可以这样做：

$(function() {
   var width = 0;
   // Get all images in the sub container
   $("img","#sub_container").each(function () {
       // Add the width of each image
       width += $(this).width();
   });
   // Do whatever you want with the width
   $("#sub_container").width(width);
});

工作示例： http://jsfiddle.net/DZ9rF/

【讨论】：

@user12932 为我工作。添加了一个小提琴来演示。

【解决方案2】：

试试这个：

$.fn.sumWidths = function() {
    var sum = 0; 
    this.each(function() {
        sum += $(this).width();
    });
    return sum;
};

然后

$('#sub_container').width( $('#sub_container img').sumWidths() );

【讨论】：