SlavaMaxwell
@SlavaMaxwell
HTML-верстальщик

Как правильно написать скрипт?

Песочница: https://codepen.io/vladgr/pen/YzqrbeN
Идея: надо при навдении добавить цвет, а при уводе мыши с ссылки цвет чтобы остался, а когда снова мышью задеть ховером этот же элемент, класс удалился
как на озоне https://www.ozon.ru/category/elektronika-15500/ выпадашка Каталог
  • Вопрос задан
  • 97 просмотров
Решения вопроса 1
SlavaMaxwell
@SlavaMaxwell Автор вопроса
HTML-верстальщик
вот помогло
$('.header__link-category').hover(function() {
    $('.header__link-category').removeClass('hover-active');
    $(this).addClass('hover-active');
    $('.tab-hover').hide().eq($(this).index()).fadeIn()
    $('.header__product-lists-wrap').hover(function() {
        $('.tab-hover').fadeIn()
    });

}).eq(1).addClass('');
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
Aetae
@Aetae
Тлен
Ну капелька логики же:
$('ul li a').mouseenter(function(){
  $(this).toggleClass('hover-active')
})

Ответ написан
cr1gger
@cr1gger
Тупые вопросы порождают тупые ответы (с)
<ul id="list">
  <li><a href="">Ссылка 1</a></li>
  <li><a href="">Ссылка 2</a></li>
  <li><a href="">Ссылка 3</a></li>
  <li><a href="">Ссылка 4</a></li>
  <li><a href="">Ссылка 5</a></li>
</ul>


const container = document.querySelector('#list')

container.addEventListener('mouseover', function(e) {
  if (e.target.tagName != 'A') return;
	const items = document.querySelectorAll('a');
	const target = e.target;
  Array.from(items).forEach(item => {
  	item.classList.remove('hover-active')
  })
  target.classList.add('hover-active')
})
Ответ написан
Ваш ответ на вопрос

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

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