最初に達成したいことを説明し、次に何を試したかを説明します。10 個のエントリを表示し、アニメーションを作成したいので、一括して「表示」するだけでなく、エントリを次々とレンダリングします。つまり、最初のエントリが表示され、100 ミリ秒後に 2 番目のエントリが表示されます。
私が疲れたのは、各エントリ オブジェクトに css ルール「display:hidden」を与えてから、エントリ ビューの didInsertElement をオーバーライドし、jquery を使用して要素をフェードインすることです。しかし、それは役に立ちませんでした。すべてのエントリのレンダリングが遅れただけです。
コードの一部を次に示します。
var inserted = 0;
EntryView = Ember.View.extend({
classNames : [ 'hide' ], // hide is display:none
didInsertElement : function(){
this._super();
this.$().fadeIn( inserted * 100 );
inserted++;
}
})
ここで何が起こるかというと、DOM に追加されたすべてのエントリがフェードインします (fadeIn に渡される値が増加し、次々に追加されたように見えます)。
しかし、私が言ったように、それは機能していません.. アイデア? ありがとう!