@m325

Пройтись по каждому элементу добавляя класс с интервалом?

Имеется такая разметка :

<ul class="warrper_bb" >
		<li class="container_bb"  id="banner_bb">
			<p class="contain_bb"  id="brand_present"></p>
		</li>
		<li class="container_bb"  id="woman_no_blur">
			<p class="contain_bb" id="brand_slogan1"></p>
		</li>
		<li class="container_bb" id="bb_big_product_bg">
			<p class="contain_bb" id="bb_big_box"></p>
			<p class="contain_bb" id="brand_slogan2"></p>
		</li>
		<li class="container_bb" id="bb_md_product_bg">
			<p class="contain_bb" id="bb_md_box"></p>
			<p class="contain_bb" id="brand_prasent2"></p>
			<p class="contain_bb" id="brand_slogan3"></p>
		</li>
		<li class="container_bb" id="bb_bg_magazin">
			<p class="contain_bb" id="bb_only_magazin"></p>
			<p class="contain_bb" id="bb_magnit"></p>
		</li>
	</ul>


Нужно начать с первого элемента .container_bb, добавлять класс .show к следующему .container_bb а в предыдущем удалять .show в cписке. C интервалом 5 секунду.

Пробывал, так :
$(document).ready(function(){
	function rotated() {
	// Устанавливаем прозрачность всех картинок в 0
	$('.container_bb').css({opacity: 0.0});
 
	// Берем первую картинку и показываем ее (по пути включаем полную видимость)
	$('.container_bb:first').css({opacity: 1.0});
 }
	setInterval(rotated(),5000);
		
		});

Подскажите как правильно это реализовать на jQuery ?
P.S. Только изучаю jQuery
  • Вопрос задан
  • 483 просмотра
Решения вопроса 1
mr_T
@mr_T
Web-разработчик
$('.container_bb').each(function(i, el) {
setTimeout(function() { $(el).addClass('show'); }, i * 5000);
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы