0

我正在制作幻灯片,我希望能够让 jquery each() 循环在每次迭代中工作,并按顺序为每个图像设置动画。

我有以下代码:单击 id 为“back”的图像时,应该开始按顺序淡化每个图像。不幸的是,它会同时淡化所有图像。

注意:元素通过 z-index 堆叠在一起。它似乎在 JSfiddle 中工作,但我已经在 firefox 中对其进行了测试,它只是一次抓取所有正确的元素并执行操作,而不是按顺序淡出它们。

$(document).ready(function () {
    $('img#back').click(function () {
        $('span').each(function (index) {
            $(this).delay(1000 * index).fadeTo('slow', 0);
        });
    });
});
4

1 回答 1

0

这是我在标记中放置 div 的顺序,它转换为 JQuery 执行操作的顺序。我的 css z-index 值与此不符,它似乎一下子将它们全部移动了。它实际上是以正确的 html 顺序移动其他人,但错误的 z-index 顺序。为了让它与类似的东西一起工作:

<div  id="safety" class="slide"></div>
<div  id="part" class="slide"></div>
<div id="inspection"  class="slide"></div>

z-index 值必须对应如下才能正确执行:#safety : z-index:3, #part : z-index:2,#inspection : z-index:1

于 2013-02-06T19:33:19.050 回答