Dependencies

• jQuery library (http://jquery.com/)

Installation

In your Django project settings, add “ajax_loading_overlay” to your INSTALLED_APPS.

Usage

Linking the JS:

<script src="{{ STATIC_URL }}ajax_loading_overlay/jquery.ajax-loading-overlay.js"></script>

Calling the plugin:

$('#target').loadingOverlay();

Removing the loading overlay (usually upon success of the Ajax call):

$('#target').loadingOverlay('remove');

Options can be passed to override the default loading class (‘loading’), overlay class (‘overlay’), loading text(‘loading…’), and/or function to return loading text padding-top:

$('#target').loadingOverlay({
    loadingClass: 'myLoadingClass',
    overlayClass: 'myOverlayClass',
    loadingText: 'Loading. Please Wait.',
    paddingTop: function (target) {
        return ((target.outerHeight() - parseInt(target.css('line-height'), 10)) / 2).toString() + 'px';
    }
});

If loadingClass or overlayClass options are passed when initializing the loading overlay, the same options must be passed when removing that overlay:

$('#target').loadingOverlay('remove', {
    loadingClass: 'myLoadingClass',
    overlayClass: 'myOverlayClass'
});

0.1.2 (2012.07.24)

• Added paddingTop option for overlay text.

0.1.1 (2011.07.14)

• JS cleanup; added JSLint options.

0.1.0 (2011.06.26)

• Initial release.