jquery - 添加宽度到父级

Question

我想创建一个包含图像的水平滚动画廊。

IE

<ul class='fluid_ul'>
<li id='fluid_li'>
<img>
</li>
<li... etc etc
</ul>

img 是百分比高度/自动宽度。li间距也有一个margin-right 。

因此，当窗口调整大小/加载时，我需要改变 UL 的宽度。

我发现之前的这篇文章看起来很有希望，但在这种情况下根本无法让它发挥作用。

任何关于如何在图像调整大小时生成 UL 宽度的想法/帮助都会很棒！

Answer 1

行，

对示例代码的html 小修正

<ul id='fluid_ul'>
    <li><img src=".." /></li>
    <li><img src="..." /></li>
</ul>

jQuery

$(window).load(function(){ // once the page has loaded (including images)
    var totalWidth = 0; // a variable to hold the total width of the li elements
    $('#fluid_ul').children().each(function(){ // for each li
        totalWidth += $(this).outerWidth(); // add its width to the total
    }).end().css({width:totalWidth}); // finally revert selection to ul and apply total
});