backgroundblur.js

A simple jQuery plugin that creates blurred backgrounds
from the images on your website using HTML5-canvas.

Learn more Download

Usage

$('body').bgblur();

generates a blurred background from the first image found in "body"

$('.section').bgblur({srccontainer:'.content'});

generates blurred backgrounds in ".section" from the first image found in ".content"

$('.footer').bgblur({usecssbgimg: true});

generates a blurred background in ".footer" from the background-image defined in css

$('.footer').bgblur({srcimg:'img/12.jpg', radius: 4});

generates a blurred background in ".footer" from the defined image with the radius "4"

Browser support

All modern browsers, which support HTML5 canvas.

Internet Explorer 9+
Firefox 2+
Chrome 4+
Safari 3+

In Chrome & Safari (webkit) this plugin will not work on your local machine!

License

This plugin is distributed under the MIT license.