Как уменьшить прозрачность части изображения?

Question

[Иван Аляев]

Моя веб-страница имеет определенный фон похожий на соты. Мне нужно, чтобы при наведении курсора мыши на определенную часть экрана, область вокруг курсора становилась прозрачной, в результате чего будет изменяться цвет вокруг ячеек. То, что я хочу, представлено на картинке. Помогите пожалуйста, как это сделать?

Comments

[Banny_Boom]

:hover

css - opacity

Answer 1

[Андрей Федоров]

Тут не надо уменьшать прозрачность. HTML5 позволяет задать несколько бекграундов через запятую.
У бекграунда который задает голубой градиен менять позицию на js.

codepen.io/aliencash/pen/PqMKVq

js чужой, т.к. не очень в нем силен.

ps: Можно было бэкграунды через css patterns сделать, но возни много. Попробуйте сами.

Comments

[Therapyx]

Смотрится просто великолепно)