0

私はスライドショーに取り組んでおり、jquery each()ループが各反復で機能し、各画像を順番にアニメーション化できるようにしたいと考えています。

次のコードがあります。IDが「戻る」の画像をクリックすると、各画像が順番にフェードし始めます。残念ながら、すべての画像が一度にフェードします。

注:要素は、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が操作を実行している順序に変換されました。私のcssz-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 に答える