1

だから私は私の最初のjQueryプラグインにいくつかのdivを取り込むためにいくつかのアニメーションを実行しています：

$.fn.turnstile = function (options, callback) {

if (!this.length) {
    return this;
}
count = this.length;
var opts = $.extend(true, {}, $.fn.turnstile.defaults, options)
var delayIt = 100;
if (opts.direction == "in") {
    opts.deg = '0deg';
    opts.trans = '0,0';
    opts.opacity = 1;
} else if (opts.direction == "out") {
    opts.deg = '-90deg';
    opts.trans = "-100px, 200px";
    opts.opacity = 0;
} else if (opts.direction == "back") {
    opts.deg = '0deg';
    opts.trans = '-2000px,0px';
    opts.opacity = 0;
} else {
    opts.deg = direction;
}
this.each(function (index) {
    delayIt += opts.delayer;
    $(this).show().delay(delayIt).transition({
        perspective: '0px',
        rotateY: opts.deg,
        opacity: opts.opacity,
        translate: opts.trans
    }, 400, 'cubic-bezier(0.33,0.66,0.66,1)', function () {
        if (opts.direction == "back" || opts.direction == "out") {
            $(this).hide();
        }
        if (!--count && callback && typeof (callback) === "function") {
            if ($(":animated").length === 0) {
                callback.call(this);
            }
        }
    });
});
return this;
};

ここで、すべてのアニメーションが完了したときにコールバックを呼び出します。これは数学的にはそうあるはずですが、(delayIt+400)*countすべてのアニメーションが完了したときにコールバックを実行することはできません。現在の状態からわかるかもしれませんが、私はチェックを試み:animated、条件を使用し!--count、アニメーションの継続時間に等しいタイムアウトを設定しようとしましたが、すべて非同期で起動するようです。これらをアニメーション化し、完了したら何かをコールバックするための最良の方法は何ですか？

.transition()プラグインに関する情報は次のとおりです。

4

1 に答える 1

2

あなたのコードでテストされていません（私はに精通していません.transition）が、これを試してください：

    ...
    this.promise().done(function(){
        alert('all done');
    });
    return this;
};
于 2012-06-19T18:33:23.980 に答える