jQuery Plugin For iOS 7 Like Semitransparent Blur View - Blear

File Size: 3.22 KB
Views Total: 2335
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For iOS 7 Like Semitransparent Blur View - Blear

Just another jQuery plugin that creates a sticky semitransparent mask over the Html elements similar to the iOS 7 blur view.

See also:

How to use it:

1. Include the jQuery javascript library and the jQuery blear plugin on the page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="blear.js"></script>

2. Create an Html element you want to apply on the blur effect.

<div id="demo">
</div>

3. The CSS to make the Html element sticky at the top of the page.

#demo {
    width: 100%;
    height: 90px;
    position: fixed;
    top: 0;
    z-index: 999;
}

4. Call the plugin on the Html element to enable the blur effect.

<script>
$(document).ready(function() {
$("#demo").blear();
});
</script>

This awesome jQuery plugin is developed by jadnco. For more Advanced Usages, please check the demo page or visit the official website.