Задать вопрос
mrka4an
@mrka4an
простой парень
javascript

Как переключать класс последовательно к след элементу?

как сделать так чтобы при клике на header класс hidden отпускался на элемент ниже и на последнем вернутся на первый ( цикл )? 

<body>
	<header>
    	<div class="block">Hello!</div>
    	<div class="block hidden">Салем!</div>
    	<div class="block hidden">Привет!</div>
    	<div class="block hidden">Merhaba!</div>
	</header>

	
	<script src="js/jquery.min.js"></script>
	<script src="js/js.js"></script>
</body>
  • Вопрос задан
  • 136 просмотров
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 3
iiiBird
@iiiBird
Пока ты спишь - твой конкурент совершенствуется
https://jsfiddle.net/6g7Lmu7o/
Ответ написан
1 комментарий
1 комментарий
Emptyform
@Emptyform
А может не надо плодить DIV-ы. Заведите себе массив с приветствиями и их и перебирайте при клике.
А то как-то топроно выглядит.
зы. студент, да?
Ответ написан
2 комментария
2 комментария
abyrkov
@abyrkov
JavaScripter 
$('.block').on('click', function() {
  var _this = $(this);
  var parent = _this.parent();
  var el = parent.find('.block:not(.hidden)').toggleClass('hidden');
  if(el[0] == parent.find('.block').last()[0]) parent.find('.block').first().toggleClass('hidden');
  else el.next('.block').toggleClass('hidden');
})

Не проверял
Ответ написан
3 комментария
3 комментария
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Бэкэнд-разработчик JavaScript
Wanted. • Москва
от 250 000 до 400 000 ₽
Senior Frontend (JavaScript) разработчик
Vital Partners
от 350 000 до 420 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Docker на развертывание Django + React
16 февр. 2025, в 15:54
2500 руб./за проект
Написание нейросети на Python или C++ для анализа ЭКГ сигналов
16 февр. 2025, в 11:06
15000 руб./за проект
Поправить View Django для загрузки данных об игре
16 февр. 2025, в 11:05
1000 руб./за проект
Ещё заказы