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