На моем сайте у меня есть меню справа от панели навигации. Отображает результаты поиска, когда они доступны на текущей странице.
Я хочу отобразить значок, когда поиск доступен.
Все поисковые блоки имеют класс .views-exposed-form
и отображаются в #navbar-collapse-second
Я добавил к своей иконке класс .icon-navbar-alert-disable
, который используется, чтобы скрыть иконку.
Как удалить класс .icon-navbar-alert-disable
, если класс .views-exposed-form
присутствует в #navbar-collapse-second
?
Вот код CSS, чтобы скрыть значок:
.region-navigation-menu-second .navbar-toggle-second .icon-navbar-alert-disable {
display: none;
}
Вот код кнопки моего ману со значком:
<div{{ attributes }}>
<a class="navbar-toggle-second collapsed" data-toggle="collapse" data-target="#navbar-collapse-second" aria-expanded="false">
<div class="icon-navbar">
<span class="fa-layers fa-3x">
<i class="far fa-circle"></i>
<span class="navbar-icon-open">
<i class="fas fa-filter" data-fa-transform="shrink-9"></i>
</span>
<span class="navbar-icon-close">
<i class="fas fa-times" data-fa-transform="shrink-8"></i>
</span>
</span>
</div>
<div class="icon-navbar-alert icon-navbar-alert-disable">
<span class="fa-stack fa-lg">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fas fa-filter fa-stack-1x fa-inverse"></i>
</span>
</div>
</a>
</div>
Вот соответствующая страница, это меню справа:
https://www.s1biose.com/boutique/ma-boutique-pro
Я запустил код JS, но он не завершен:
$('#navbar-collapse-second') ???.views-exposed-form??? {
$('#block-togglenavigationsecond').removeClass('icon-navbar-alert-disable');
});
UPDATE
(function ($) {
if ($('#navbar-collapse-second').hasClass('views-exposed-form')) {
$('#block-togglenavigationsecond').removeClass('icon-navbar-alert-disable');
} else {
$('#block-togglenavigationsecond').addClass('icon-navbar-alert-disable');
};
})(window.jQuery);
введите описание изображения здесь