Skip to content
Plugin which adds Gaussian Blur effect for images
JavaScript
Find file
Latest commit 769e2ee @finom Changed README
Failed to load latest commit information.
README Changed README
index.html Changed README
jquery.gaussian-blur.js Changed README

README

This is the plugin which adds Gaussian Blur effect for images. This plugin uses the SVG and filter property for Internet Explorer 8-. Plugin doesn't work in Safari because it doesn't support feGaussianBlur element. You can use canvas element to support it but here is no canvas. 

Here is one remark: each image should be in some container (e.g. span)

Using
$('.blurImageContainer').gaussianBlur({
	deviation: 3, //level of blur
});

You should to add that styles:
.blurImageContainer {display: inline-block; position: relative; overflow:hidden;}
.blurImageContainer > .blurImage {position: absolute; top:0; left:0; z-index:1;}
.blurImageContainer > [id^="blurred"] {position: absolute; top:0; left:0; z-index:0;}

Live Example
http://finom.ho.ua/blur/
Something went wrong with that request. Please try again.