Page Elements Blurring Plugin For jQuery - foggy
File Size: | 43.5 KB |
---|---|
Views Total: | 1708 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

foggy is a simple and fun jQuery plugin that allows you to add a blur effect to your webpage element that makes other certain elements of your page become more eye-catching. foggy is only compatible with those browsers which support the "-webkit-filter: blur" CSS attribute. For other browsers, it will fall back to a manual blur.
How to use it:
1. Include jQuery library and foggy.js on your page
<script type='text/javascript' src='./media/jquery-1.8.1.min.js'></script> <script type='text/javascript' src='jquery.foggy.min.js'></script>
2. Call the plugin
<script type='text/javascript'> $(document).ready( function(){ $('.foggy-demo').foggy(); }); </script>
3. Markup
<div class='foggy-demo'> ... </div>
4. Options
$('.your-selector').foggy({ blurRadius: 2, // In pixels. opacity: 0.8, // Falls back to a filter for IE. cssFilterSupport: true // Use "-webkit-filter" where available. });
This awesome jQuery plugin is developed by nbartlomiej. For more Advanced Usages, please check the demo page or visit the official website.