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

Доброго времени суток! на данном сайте (Не реклама). В меню имеется эффект наведения.. что то похожее как в Windows 10. Частичное изменение цвета border'a. Подскажите как можно реализовать подобный эффект? (Пример ниже на картинке)

66412c6454963847362541.png
  • Вопрос задан
  • 5601 просмотр
Решения вопроса 1
Get-Web
@Get-Web Куратор тега CSS
Front-End Developer
Интересная задача. В общем весь фокус в том, что поверх видимых карточек, лежит точно такая же сетка с невидимыми карточками у которых есть только синий border. На сетку, которая лежит сверху, наложена маска:
mask: radial-gradient(320px 320px at var(--x) var(--y), black 1%, transparent 40%);

То есть у всего блока с синими border остается видимым только радиальный градиент в 320px, а x и y это координаты курсора. Ну и грубо говоря получается такая картина:

Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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