0

我目前有同一类的 x 重复设置:

<div class="span3">..content1</div>
<div class="span3">..content2</div>
<div class="span3">..content3</div>

如何单独定位每个 .span3 类而不为每个类添加一些唯一的 id?这甚至可能吗?

我想要做的是一次在每个 .span3 上应用一些动画,每个动画之间有一点延迟 - 比如一次淡化一个 .span3 类,或者做一些其他动画,比如从 0 到 1 的缩放。

试图弄清楚我是否可以以某种方式将它们添加到数组中?从那里开始, id 就可以做任何我想做的事情来遍历数组。

更多 HTML 上下文中的 .span 类:

<div class="row-fluid">
      <div class="span3">
        <span>Headline</span>
        <img src="images/thumb_1.gif" class="img-polaroid">
      </div>
      <div class="span3 frameColor_yellow">
        <span>Headline</span>
        <img src="images/thumb_2.gif" class="img-polaroid">
      </div>
</div>
<div class="row-fluid">
      <div class="span3">
        <span>Headline</span>
        <img src="images/thumb_3.gif" class="img-polaroid">
      </div>
      <div class="span3 frameColor_yellow">
        <span>Headline</span>
        <img src="images/thumb_4.gif" class="img-polaroid">
      </div>
</div>
//etc...

有什么建议么?

4

3 回答 3

4

像这样 -

$('.span3').each(function(index,element){
    var sp = $(this);
    // do your stuff with this span
});
于 2013-04-24T20:14:33.153 回答
2

尝试这个:

$(".row-fluid > .span3").each(function (index) {
    $(this).delay(index * 500).animate({
        opacity: 0
    }, 500);
});

小提琴

根据@Rodrigo 的建议更新了答案!

于 2013-04-24T20:21:35.747 回答
0

可能您想将所有 span3 包装在一个容器中,可以说

<div class="my-loop-divs">
   <div class="span3"></div>
   <div class="span3"></div>
</div>

我假设您使用的是 zepto 或 jQuery

$(document).ready(function () {
    $('.my-loop-divs .span3').each(function (index, element) {
        // do the animation on $(this)
    });
});
于 2013-04-24T20:23:03.087 回答