How to blur page element using jQuery
Foggy is a jQuery plugin for blurring page elements. Foggy by default uses the "-webkit-filter: blur" CSS attribute. If the browser doesn't support it, Foggy falls back to a manual blur. It makes several copies of the selected HTML element. It adds transparency to all copies and moves each of them by small amount, thus creating the blur effect.
It supports IE (8 and up), Firefox, Safari and Chrome.
How to use?
$('.your-selector').foggy({ blurRadius: 1, // In pixels. opacity: 0.8, // Falls back to a filter for IE. cssFilterSupport: true // Use "-webkit-filter" where available. });
Feel free to contact me for any help related to jQuery, I will gladly help you.