angular-deep-blur | Child-aware blur handler for Angular

angular-deep-blur

angular-deep-blur

Stars : 10

Forks : 10

Created by Myplanet

bower install angular-deep-blur

Demo Download GitHub

angular-deep-blur

angular-deep-blur detects when neither the element nor any of its children are in focus (i.e. the element is blurred by the focusing of another element outside the element.) This is especially useful if you want to hide a dropdown on blur.

Demo and documentation

Include angular-deep-blur.js in your application, after Angular is included.

<script src="path/to/angular.js"></script>
<script src="path/to/angular-deep-blur.js"></script>

You may use an AMD or CommonJS loader as well.

Initialize your Angular application with the mp.deepBlur module as a dependency:

angular.module('app', [ 'mp.deepBlur' ]);

Then use the deep-blur attribute on an element to specify an expression that will be evaluated when neither the element nor any of its children are in focus:

<div deep-blur="hideDropdown()">
    <!-- ... -->
</div>

Javscript

Javascript plugin

Angular-js