@Breeze1

Убрать\добавить класс по клику?

Есть навигация вперёд/назад.

По клику вперед убирается класс active у текущего элемента, и добавляется следующему, по клику назад убирается класс у текущего, и добавляется предыдущему.

Можно как-то сделать чтобы класс добавлялся бесконечно ? например, если мы на 3 элементе, нажимаем "вперёд", класс active добавляется первому элементу.
https://codepen.io/brezze/pen/YdrrOL
  • Вопрос задан
  • 70 просмотров
Решения вопроса 1
0xD34F
@0xD34F
Добавляем кнопкам атрибут, который будет указывать относительную позицию следующего активного элемента:

<span class="prev" data-step="-1">Prev</span>
<span class="next" data-step="+1">Next</span>

Вешаем общий обработчик клика:

$('.nav').on('click', '[data-step]', function() {
  const
    $items = $('ul li'),
    $active = $items.filter('.active'),
    index = $active.index();

  $active.removeClass('active');
  $items.eq((index + +$(this).data('step')) % $items.length).addClass('active');
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через TM ID
Похожие вопросы