-2

少しずつ登場するキャラクターが欲しいので、このスクリプトを作成しました。ただし、遅延はまったく実行されないようです-数千に設定しようとしましたが、結果は変わりませんでした。何が恋しいですか？

$(document).ready(function () {

    var 
        i,
        d = [500, 300, 600, 1000],
        t = "String";

    $("body")
        .delay(flashDuration[0])
        .animate({ backgroundColor: "#888888" }, d[1])
        .animate({ backgroundColor: "#222222" }, d[2])
        .animate({ backgroundColor: "#F8ECC2" }, d[3], null, function () {
            for (i = 0; i < t.length; i++)
                $("<span>" + t.substr(i, 1) + "</span>")
                    .addClass("hidden")
                    .delay(i * 2000) /* this delay doesn't execute */
                    .addClass("visible")
                    .appendTo("#floatingName");

        });
});

d は長さ、t はタイトルなので、私の頭を噛まないでください。名前を省略したのは、すべてのプログラマーが不可解で自明ではない短い変数名を好むためです。右？真剣に、私はラッピングを避けようとしました。

また、ここで jsFiddle に投稿しようとしましたが、この例では画面が点滅することさえありません。遅延を適切に実行することは言うまでもありません。

4

2 に答える 2

2

私の知る限り、jQuery はまだカラー アニメーションをネイティブにサポートしていません。

カラー アニメーション拡張機能が含まれている jsFiddle のコードのバージョンを次に示します。

http://jsfiddle.net/8XUpL/4/

于 2012-07-23T16:10:49.340 に答える
2

animate() の 2 番目のパラメーターは、アニメーションがアニメーション化される時間です。アニメーションが始まる前の時間ではありません。チェーン内のすべての animate() の間に delay() を配置する必要があります。

$("body")
    .delay(flashDuration[0])
    .animate({ backgroundColor: "#888888" }).delay(d[1])
    .animate({ backgroundColor: "#222222" }).delay(d[2])

等々...

animate() の queue オプションを使用して、アニメーションを次々に実行するのではなくスタックさせることもできます。

すべてここで説明されています http://api.jquery.com/animate/

編集

Delay はスクリプトの実行を遅らせず、アニメーション キューの次のアイテムを遅らせるだけです。したがって、このように使用することはできません。代わりに setTimeout を使用する必要があります。

http://api.jquery.com/delay/

.delay() メソッドは、キューに入れられた jQuery エフェクト間の遅延に最適です。制限があるため (たとえば、遅延をキャンセルする方法は提供されません)、.delay() は JavaScript のネイティブな setTimeout 関数に代わるものではなく、特定のユース ケースにより適している場合があります。

于 2012-07-23T16:02:02.593 に答える