Показать сообщение отдельно
  #1 (permalink)  
Старый 19.10.2014, 18:14
Интересующийся
Отправить личное сообщение для eucalipt Посмотреть профиль Найти все сообщения от eucalipt
 
Регистрация: 27.08.2014
Сообщений: 19

Помогите написать правильный код
Здравствуйте, делаю что-то на подобии карусели на сайт, только вместо прокручивания, блоки карусели должны медленно исчезать, а на их месте должны появляться другие. У меня уже есть идея, как это можно сделать, только не получается написать правильный код.

Итак, сама идея. Как только проходит определенный промежуток времени, сразу к элементу карусели (div.slide) должен добавляться класс active. По умолчанию прозрачность всех элементов будет равна нулю. А если к нему был добавлен класс active, то мы меняем прозрачность на 1. (Кстати, думал сделать не с прозрачностью, а с visibility иди display, какие у вас мысли по этому поводу).

Собственно, попытался организовать это следующим скриптом.
$(document).ready(function() {
	
	$numSlides = $("div.mgr div.slide").length;
	$slide = $("div.mgr div.slide");
	
	for (var i = 1; i <= $numSlides; i++) {
		
		setTimeout(function() {
		
			$("div.mgr div.slide." + i).addClass("active");
			
		}, 5000);
		
	}
	
});


Но он, почему-то, по истечении 5 секунд, тупо добавляет класс только последнему элементу.

HTML на всякий случай
<div class="mgr">
			<div class="slide 1">Первый слайд</div>
			<div class="slide 2">Второй слайд</div>
			<div class="slide 3">Третий слайд</div>
			<div class="slide 4">Четвертый слайд</div>
			<div class="slide 5">Пятый слайд</div>
		</div>



Помогите грамотно организовать код, пожалуйста!
Ответить с цитированием