Проблема с эффектом fadeIn()
 

Добрый день!
Я только начинаю осваивать JavaScript и jQuery и почти сразу же столкнулась с проблемой: есть две группы объектов, которые должны плавно и одновременно менять содержимое (например отображение человек/его расписание). С одновременностью проблем нет, но при наложении эффекта(fadeIn()/fadeOut()) элементы групп сначала меняются синхронно с эффектами, а затем начинают их опережать. Кто-нибудь уже сталкивался с подобной проблемой? Из-за чего это может быть?
Как я понимаю, ошибка как-то связана скорее всего с эффектом, т.к. при одинаково заданном времени, эффект на одном из блоков, скажем на 3-ем цикле, срабатывает быстрее чем на втором, однако появляются они(если без fadeIn) по-прежнему одновременно.

annie88,
делайте минимальный макет иначе можно только гадать что и как у вас.

Код что-то вроде этого:

$('.fc-day-grid').stop().fadeIn(4500).delay(9500);
	 $('.fc-day-grid').fadeOut(800);//для графика
	  $("#in-active-block").stop().fadeIn(4500).delay(9500);
	  $("#in-active-block").fadeOut(800);//для блока отображения

annie88,
маловато будет ... что дожно синхронно показыватся, то должно синхронно запускатся
что-то типа

$("#in-active-block, .fc-day-grid").fadeOut(800)

это-то и интересно, что без fadeIn()/fadeOut() объекты исчезают и появляются одновременно. Эффект же какое-то время тоже действует синхронно, а затем почему-то на одном объекте он начинает действовать быстрее, а на другом медленнее, да и вообще начинает складываться впечатление, что время на них сместилось

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

а, нет, показалось :cray:
все также плохо...

annie88,

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

// прокрутка ленты на высоту блока
function loadingScrollingPage(){
	// если есть элемент в переменной LastActiveDoc
	if (LastActiveDoc){
		// вставим скопированный блок в самый конец общего блока
		document.getElementsByClassName('doc')[0].parentNode.appendChild(LastActiveDoc);
		// удалим первый блок
		document.getElementsByClassName('doc')[0].remove();
		PreloadDataCalendar();
	}
	// возьмем первый элемент
	var activElement = document.getElementsByClassName('doc')[0];		
	//создадим див
	LastActiveDoc = document.createElement('div');	
	//присвоим ему класс doc
	LastActiveDoc.className = 'doc';	
	//поместим содержимое первого блока в созданный блок
	LastActiveDoc.innerHTML = document.getElementsByClassName('doc')[0].innerHTML;
	// возьмем высоту первого блока
	var pixelScrollElement = activElement.offsetHeight;
	var sum = 0; //служит для вывода номера активного блока ( для того чтобы счет велся с третьего блока)
     if((numBlock+2)>countBlock)
	 {index++; sum = index; }
	 else{ index = 0; sum = numBlock+3;}	
	numBlock < countBlock?numBlock++:numBlock = 0;	
		// прокрутим блок вверх на всю его высоту
	$(activElement).delay(10000).animate({ marginTop: -pixelScrollElement}, 5000,loadingScrollingPage);
}

в функции отображения графика (он отображается из JSON-файла), вызывается Effect()

function Effect(visualElement){
//присваивается значение блоку отображения
document.getElementById('effect').innerHTML =  visualElement.innerHTML;
//запуск эффекта для графика и окна с "активным" человеком
$('.fc-day-grid, #in-active-block').stop().fadeIn(4500).delay(9500).fadeOut(800);
}

и вот здесь я начинаю тупить :-?
Время, дающее в сумме 15с.(время прокрутки ленты) вызывает разницу в отображении, примерно на 6-ом блоке первой итерации, то что я применила выше также выдаст "мигание", но на 10-ом блоке 2-ой итерации, затем происходят какие-то короткие периоды, когда блоки отображаются нормально, затем снова начинают "мигать"

annie88,
не осилил ваш код ... но раз мигает значит одно и тоже навешано несколько раз, перед запуском новой анимацции обнулить предыдущую, где - то stop не недобавлен или требует параметров или анимация навешивается бесконечно.