3

ページ上の div 要素の読み込みと移動をいじっています。文字列をフェードインしてから逆にしようとしています。リバース ループは、最初のフェード イン ループが完了するまで待機する必要があります。これは私がこれまでに持っているものですが、逆ループを実行しません。最初のdivがまだ表示されていないためだと思います。

var string_to_reverse = "Reverse",
i;

for (i = 0; i < string_to_reverse.length; i++) {
    $("<div>" + string_to_reverse[i] + "</div>").hide()
        .appendTo("body").delay(500 * i).fadeIn(1000);
}

$("body div:last").load(function () {
    for (i = 1; i <= $("body div").length; i++) {
        $("body div:eq(" + i + ")").detach().prependTo($("body"));
    }
});

http://jsfiddle.net/vk45U/

4

2 に答える 2

2

div には load イベントがないため、$("body div:last").load何もしません。関数を fadeIn に渡して、操作の完了後に起動することができます。最後のアニメーション div にコールバックを追加してみてください。少し面倒ですが、きれいにできると思います

var string_to_reverse = "Reverse",
i;

for (i = 0; i < string_to_reverse.length; i++) {
    var dummy = function(){};
    $("<div>" + string_to_reverse[i] + "</div>").hide()
        .appendTo("body").delay(500 * i).fadeIn(1000, (i == string_to_reverse.length - 1)?rev:dummy);
}

function rev () {console.log('rev');
    for (var i = 1; i <= $("body div").length; i++) {
        $("body div:eq(" + i + ")").detach().prependTo($("body"));
    }
}

http://jsfiddle.net/mowglisanu/wXrC9/

于 2012-12-23T06:56:51.783 に答える
1

あなたがやろうとしていることは間違っています: あなたは、何かがどれくらいの時間を要するかを本当に知りません (あなたは推測することしかできず、時には単に経験に基づいた推測をすることもありますが、それでも推測にすぎません)。

現在のアプローチに頼るのではなく、イベントベースのプログラミング アプローチを検討してください。あなたの場合、イベントハンドラー（たとえばonload、外部コンテンツをロードしている場合は " "イベントハンドラーを使用）または高次関数（いくつかのアクションを実行した後に呼び出されるコールバックを使用し、おそらくそれらを一部としてアタッチすることもできます）を使用できますベントハンドラーのも)。

もっと読む：

于 2012-12-23T06:59:04.177 に答える