DPritu
@DPritu

Как заменить 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
  • Вопрос задан
  • 344 просмотра
Решения вопроса 1
Ну вот как-то так :)

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

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

Войти через TM ID
Похожие вопросы
18 июля 2018, в 22:20
4000 руб./за проект
18 июля 2018, в 21:54
1000 руб./в час