Задать вопрос
@Asokr

Как менять бекграунд у фонового квадрата при наведении?

Приветствую всех. Есть проблемка, мне нужно менять цвет у фонового квадрата при наведении на него.
Этого удалось добиться путём генерации квадратов и добавлении их в секцию в абсолюте. При этом контейнеру добавлен z-index выше, чем квадратам.
Естественно при наведении ничего не меняется, поэтому контейнеру пришлось добавить pointer-events: none.

Но мне хочется сохранить нативное поведение, чтобы текст можно было выделить...

Вот о чем речь (скриншот не снял мышку, она сейчас над текстом, в соответствующем квадрате)
65d86b60e42ba326106551.png

Может подскажите, как ловить ховер мыши, на слое у которого z-index меньше (не думаю, что возможно :( )
Или другое решение, может есть библиотека какая, с помощью которой это можно сделать,
или у вас есть пример, как это реализовать (искал, ничего не нашёл)...

Заранее спасибо...
----------------------------------
Залил на кодепен
https://codepen.io/asokr/pen/ZEPdWxK
  • Вопрос задан
  • 93 просмотра
Подписаться 1 Средний 5 комментариев
Пригласить эксперта
Ответы на вопрос 2
akseonowww
@akseonowww
Frontend Developer
Думаю квадрат нужно поместить внутрь блока с текстом, чтобы задействовать наведение родителя:
.container:hover .box {...}
Ответ написан
yesbro
@yesbro
Думаю, помогаю думать
Пришлось подумать. Единственный вариант который сработал это следить за mousemove в родительском контейнере и динамически вычислять какой квадрат надо подсвечивать.

https://codepen.io/yepbro/pen/LYaKRPp
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы