Изучение додзё: создание цепочек анимаций для коллекции объектов

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

  •  05-07-2019
  •  | 
  •  

Вопрос

Я делаю некоторые базовые упражнения с dojo, чтобы изучить его синтаксис и методы.

Ниже я создал упрощенный пример с целью изучения анимации цепочки для группы элементов.

Может ли кто-нибудь предложить свой отзыв о коде додзё, который я создал? Использую ли я правильные библиотечные функции в этих обстоятельствах? Какой из вариантов додзё, по вашему мнению, является лучшим решением для этого варианта использования?

Для справки, в jQuery я бы выполнил это с помощью:

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

Для решения dojo я предложил четыре решения, основанные на наличии различных компонентов dojo:

// 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();

});
Это было полезно?

Решение

Мои предложения следующие:

<Ол>
  • Оцените и посмотрите, что работает лучше всего.
  • Используйте то, что вам удобнее всего.
  • Imo вариант 4 - лучший.
  • Перейдите на канал #dojo на freenode. Там есть отличные ребята (включая меня), которые помогут вам с любым возникшим вопросом.
  • Лицензировано под: CC-BY-SA с атрибуция
    Не связан с StackOverflow
    scroll top