Последовательное появление

Рейтинг: 2Ответов: 1Опубликовано: 27.12.2014

Здравствуйте.

У меня есть такой HTML код:

<div class="good">Текст 1</div> 
<div class="good">Текст 2</div>  
<div class="good">Текст 3</div>  
<div class="good">Текст 4</div>

Класс .good скрыт display:none;.

Как мне сделать, чтобы при загрузке страницы этот скрипт $("div[class^='good']").show('normal') открывал не все блоки сразу, а последовательно?

jquery
Источник: Stack Overflow на русском

Ответы

▲ 2Принят

Для начала, ваша конструкция:

$("div[class^='good']");

Это просто сумасшедшее пренебрежение процессорным временем и ресурсами, используйте, пожалуйста:

$('.good');

Ну а по теме вопроса можно сделать так:

var $target = $('.good');
var hold = 200;

$.each($target,function(i,t){
     var $this = $(t);
     setTimeout(function(){ $this.show('normal'); },i*hold);
});

Я применил ещё задержку 'hold', которая даёт эффект именно последовательного открывания.