Question

我有以下代码：

function computeSetImgMargins(iD) {
 var ids = iD;
 var totalWidth = 0
 var totalHeight = 0;
 ids.children().each(function(index){
     var imgWidth = ids.children().width();
     var imgHeight = ids.children().height();
     totalWidth += imgWidth;
     totalHeight += imgHeight;
     var leftMargin = imgWidth - totalWidth;
     var topMargin = imgHeight - totalHeight;
     ids.children(index).css('margin-left',leftMargin);
     ids.children(index).css('margin-top',topMargin);
   });
}
var objLi = jquery("li", this);
computeSetImgMargins(objLi);

我的Html有这样的东西

<div id="imgrt">
<ul id="if">
   <li><img src="../pictures/album/20-c-44.jpg" /></li>
   <li><img src="../pictures/album/20-c-44.jpg" /></li>
</ul>
</div>

我没有每个元素的单独ID或类。我不确定这是不是一个好主意（可以对评论开放），但是如果不使用它，我如何对每个<li>应用不同的margin-left和margin-top位置，以及{{1} <img>中的元素？

我想这两个图像会重叠。

我<ul>的CSS如下：

<ul>

Answer 1

取代ids.children()使用$(this)。在每个中，$(this)将为您提供循环中的当前项目。

http://jsfiddle.net/nvnTW/

如何对列表中的每个孩子应用不同的css margin-top

1 个答案: