Как сверстать Гауссово размытие

Как сверстать Гауссово размытие


Для одного из своих проектов мне понадобилось сделать так, чтобы каждая картинка подсвечивалась своим цветом, а цвет соответственно брался с картинки. Вот здесь-то я слегка и встрял и начал гуглить, как же такое реализовать и что самое главное нужно было найти лучший для меня вариант. В графическом редакторе свечение — это дубликат картинки с применением размытия по Гауссу в несколько десятков пикселей.

Сначала была мысль сделать размытие, используя canvas. Но, как оказалось, проще сделать это без канваса и яваскрипта через SVG-фильтры. CSS-фильтры от Adobe ещё не слишком распространены: работают с префиксом только в webkit. У SVG-фильтров поддержка намного шире — все современные браузеры, кроме Safari 5.1 и Андроид браузера. А в IE уже начиная с версии 5.5 есть старые добрые фильтры (те самые, с длинным названием filter: progid:DXImageTransform.Microsoft.Blur(pixelradius=70);), которые, тем не менее, прекрасно справляются с задачей.

[center][/center]
Также рекомендуем

Информация

Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.