Package Exports

jquery-dim-background

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (jquery-dim-background) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

jquery-dim-background

jQuery plugin to dim the current page except for some user-defined top elements.

Usage

Include the script in your website first. Add this script tag after your jQuery inclusion.

<script type="text/javascript" src="http://andywer.github.io/jquery-dim-background/jquery.dim-background.min.js"></script>

Usage is simple. You can dim your website, but keep some elements on top of the curtain:

<script type="text/javascript">
    $('.myElements').dimBackground();
</script>

To switch back to normal:

<script type="text/javascript">
    $('.myElements').undim();
    // - or -
    $.undim();
</script>

You can also provide a callback function that is called when the animation completes and you can overwrite default options:

(You may find the available options in the jquery.dim-background.js file. Have a look at $.fn.dimBackground.defaults)

<script type="text/javascript">
    $('.myElements').dimBackground({
        darkness : 0.8            // 0: no dimming, 1: completely black
    }, function() {
        // do something
    });
</script>

Demo

Have a look at a basic example that shows what this plugin does.

License

This plugin is published under the MIT license. See license.

Have a lot of fun!