логика $ .each и циклы в jquery

Question

Я пытался создать отзыв для страницы, которая будет иметь эффект слайд-шоу fadeIn (), fadeOut ().У меня это работает с плагином, но я действительно хочу понять, как это работает, для настройки в будущем.

Я вижу, как это работает с добавлением / удалением классов, но возможно ли это с помощью циклов?У меня так много проблем с тем, как JavaScript не делает пауз между циклами.Возьмите следующий код, например:

    <div class="container"></div>

   var jedi = new Array();
  jedi[0]= 'Anakin';
  jedi[1]= 'ObiWan';
  jedi[2]= 'Jacen Solo';

  $.each(jedi,function(counter,value){

    $('.container').append('<p class="blue">' + jedi[counter] + '</p>').children().fadeIn(800*counter);
    $('.container').children().fadeOut(800);
    //alert(value);

     })

Вот и jsfiddle: http://jsfiddle.net/jpmMR/

Я хотел бы добавить имя персонажа, затем оно исчезает, а затемпарень и тд.Но то, что происходит, это большой беспорядок.Если это возможно, может кто-нибудь показать мне, как это возможно?Также, если это не слишком большая проблема, могут ли они объяснить мне «как» и «почему» обойти тот факт, что JS завершает цикл в миллисекундах.И если не больше проблем, объясните это по-английски, как мне 9 лет.

Также возможно ли зациклить $ .each?Большое спасибо заранее.Это убивает меня.

Answer 1

Если вы хотите объединить анимацию в цепочку, вам нужно запустить вторую функцию завершения первого и так далее. Так как вы запускаете все анимации одновременно. Вы можете увидеть, как работают функции завершения анимации в соответствующей документации jQuery .

Кроме того, вы можете настроить очередь анимации в jQuery, чтобы каждая из них работала за другой.

Answer 2

Вы также можете сделать что-то подобное ... хотя это не так гибко, если вы хотите делать другие цепные анимации.

http://jsfiddle.net/jpmMR/1/

Answer 3

Как и принятый ответ здесь , вам придется использовать обратные вызовы. Функция each() выполняется без задержки для каждого из элементов, поэтому вы выполняете их асинхронно.