Как реализовать такую анимацию?

Question

[Дмитрий]

Есть блоки div с изображением, по три в каждом ряду, внутри скрыт текст;
необходимо чтобы происходила анимация - сначала отображается текст во всех div в первом ряду и исчезает, далее второй ряд, потом третий ряд, анимация должна быть бесконечной с одинаковым интервалом между появлением каждого ряда, посоветуйте как реализовать

Answer 1

[Андрей]

Используйте setInterval()

Answer 2

[M-ka]

Может гифкой в вечном цикле? Тогда и дивы не нужны)

Comments

[Дмитрий]

тогда весь сайт вообще делать на картинках и на гифках, забавно получится))

[M-ka]

Дмитрий: если картинка мелкая, то можно и анимированая гифка.... при использовании интервалов, ставится под вопрос последовательная цепочка для выполнения... При плохой реализации, пользователь может и закроет страничку, если браузер не откинет ее сам.... но больше и не вернется

Answer 3

[Дмитрий]

уже сделал, оказалось что надо поочередно каждый div, кому интересно вот мое решение, может быть оно и не самое лучшее но все же работает)

function workStep(){
		var target = $(".work-step .item .info");
		var hold = 4000;
		target.each(function(i, elem){
			var timer = setTimeout(function(){ $(elem).animate({'opacity': '1'},   1000).animate({'opacity': '0'}, 1000); }, i*hold);
		});
	}

workStep();

	var workStepTimer = setInterval(function() {
      workStep();
   }, 24000);