@pilolin
HTML программист

Как реализовать плавное выделение объекта на изображении?

Имеются изображения на котором запечатлены люди. При наведении на человека он выделяется обводкой остальное все немного приглушается. Сделал по уродски, но другое ничего не пришло в голову и не нашел. Реализация такая, в верстку вставил 2 svg. Первая категория - это изображения и их обводки, второе #mask - это 1 svg на все. Что бы подсвечивать обводку я просто добавляю цвет её при ховере. Но что бы создать тусклый фон на всем изображении исключая человека на которого навели я использую маску. Беру контур, вставляю его во второе svg #mask и таким образом получаю по маске выделенную область. (svg приходится обновлять после вставки ободки $('#mask').html($('#mask').html()))

На данном этапе я могу только сделать плавную обводку, а вот с маской проблемы, она или есть или ее нет, т.е. резкие переходы. Нужно как то сгладить. Что можно сделать в данном случае, или может есть какие то другие пути решения?

Страница
  • Вопрос задан
  • 158 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

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