道場の学習:オブジェクトのコレクションでアニメーションを連鎖する

StackOverflow https://stackoverflow.com/questions/1800832

  •  05-07-2019
  •  | 
  •  

質問

私はdojoの基本的な演習を行って、その構文とメソッドを学習しています。

アイテムのグループでチェーンアニメーションを学習する目的で、以下の簡単な例を作成しました。

私が作成した道場コードに関するフィードバックを提供してくれる人はいますか?この状況で正しいライブラリ機能を利用していますか?このユースケースに最適なソリューションは、どの道場オプションだと思いますか?

参照用に、jQueryでこれを実現します:

$(function() {
    // jQuery
    $('div').fadeOut().fadeIn();
})

道場ソリューションについては、さまざまな道場コンポーネントの存在に依存する4つのソリューションを考え出しました。

// dojo
dojo.require("dojo.fx");
dojo.require("dojo.NodeList-fx");

dojo.addOnLoad(function() { 

    // Option 1: Using dojo.js only
    dojo.forEach(dojo.query('div'), function(div) {
        dojo.fadeOut({
            node: div,
            'onEnd': function() {
                dojo.fadeIn({
                    node: div
                }).play();
            }
        }).play()
    });    

    // Option 2: Using dojo.js and dojo.fx
    dojo.forEach(dojo.query('div'), function(div) {
        dojo.fx.chain([dojo.fadeOut({node: div}), dojo.fadeIn({node: div})]).play();
    });

    // Option 3: Using dojo.js, dojo.fx and dojo.NodeList-fx
    var divs = dojo.query("div");
    divs.fadeOut({
        'onEnd': function() {
            divs.fadeIn().play();
        }
    }).play()

    // Option 4: Using base, dojo.fx and dojo.NodeList-fx
    var divs = dojo.query('div');
    dojo.fx.chain([divs.fadeOut(), divs.fadeIn()]).play();

});
役に立ちましたか?

解決

私の提案は次のとおりです。

  1. ベンチマークを行い、何が最も効果的かを確認します。
  2. 最も快適だと思うものは何でも使用してください。
  3. Imoオプション4が最適です。
  4. freenodeの#dojoチャネルに移動します。そこには、私を含めて、どんな質問でもあなたを助ける素晴らしい人がいます。
ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top