Задать вопрос
DPritu
@DPritu
javascript

Как заменить CSS у 2 div при наведении на любую ссылку?

Имеется две версии логотипа: серый (неактивный) и красный (активный). (div id="logo")
На сайте стоит фоновое изображение (div id="bg").

Нужно сделать так, чтобы при наведении на любую ссылку размещенную через тег a логотип сменялся на красный и поверх фонового изображения появлялась картинка красного цвета. К слову, эта картинка сейчас вставлена через тег div class="overlay", а в CSS выставлено display: none т.к. я не знаю, как сделать так, чтобы она активировалась только при наведении.

Я пытался реализовать это через a:hover + .overlay + #logo, пытался через a:hover + .overlay. Но это работает только тогда, когда картинка и ссылка находятся в одном div и в определенном порядке, а мне надо, чтобы это все работало независимо от div.
Не важно, на чем это будет написано (CSS, JS) - главное, чтобы работало.

Результат должен быть таким:

До:
59de33bb70f69145880005.png
После наведения на любую ссылку:
59de33c3c47d3577372470.png
  • Вопрос задан
  • 391 просмотр
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 1
@cherniavsky5
Ну вот как-то так :)

$(function () {
	$('a').hover(function () {
		$('.overlay').fadeToggle(200);
		$('#logo').toggleClass('is-active');
	});
});
Ответ написан
4 комментария
4 комментария
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
summer • Ярославль
от 100 000 до 140 000 ₽
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
Мэтч
от 80 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Настройка шаблона
19 апр. 2024, в 15:01
35000 руб./за проект
Разработать телеграмм бота для анонимных сообщений
19 апр. 2024, в 14:53
30000 руб./за проект
Разработать парсер и админку
19 апр. 2024, в 14:12
30000 руб./за проект
Ещё заказы