0

Привет всем помогите пожалуйста новичку... вот такой код

мне нужно чтобы вторая часть срабатывала при клике на body при условии что боковое меню с классом active

$('body').on('click', '.hamburger', function(e){
$('.hamburger').addClass('hamburger_active');
$('.header__menu').addClass('header__menu_active');
 });
$('body').on('click',function(e){
$('.hamburger').removeClass('hamburger_active');
$('.header__menu').removeClass('header__menu_active');
});

1 ответ 1

0

есть ли у элемента класс можно узнать с помощью функции hasClass()

$('body').on('click','.hamburger', function(e){
  if ($('.hamburger').hasClass('hamburger_active')) {
    $('.hamburger').removeClass('hamburger_active');
    $('.header__menu').removeClass('header__menu_active');
  } else {
    $('.hamburger').addClass('hamburger_active');
    $('.header__menu').addClass('header__menu_active');
  }
});
.hamburger_active {
  color: blue;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="hamburger">hamburger</div>

Так же можно укоротить функцию используя toggleClass()

$('body').on('click', '.hamburger', function(e){
    var hasNotClass = !$('.hamburger').hasClass('hamburger_active');
    $('.hamburger').toggleClass('hamburger_active', hasNotClass);
    $('.header__menu').toggleClass('header__menu_active', hasNotClass);
});
.hamburger_active {
  color: blue;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="hamburger">hamburger</div>

1

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.