https://github.com/zeecoder/hv-ajax-loader

[ABANDONED] A small jQuery plugin to help visualize ajax loading.
https://github.com/zeecoder/hv-ajax-loader

Last synced: 10 months ago
JSON representation

[ABANDONED] A small jQuery plugin to help visualize ajax loading.

• Host: GitHub
• URL: https://github.com/zeecoder/hv-ajax-loader
• Owner: ZeeCoder
• Created: 2013-08-25T21:55:45.000Z (over 12 years ago)
• Default Branch: master
• Last Pushed: 2015-05-20T13:12:03.000Z (over 10 years ago)
• Last Synced: 2025-01-27T13:14:22.151Z (12 months ago)
• Language: CSS
• Homepage:
• Size: 168 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# hv-ajax-loader

[![Project Status](http://stillmaintained.com/ZeeCoder/hv-ajax-loader.png)](http://stillmaintained.com/ZeeCoder/hv-ajax-loader)

A small jQuery plugin to help visualize ajax loading.

The basic idea of this project is to be able to switch on/off ajax loading effect(s) easily when needed.

The javascript and the css are completely separated. The script won't even use a `display: none` code.

Online demo:

 - http://hubertviktor.com/_git/hv-ajax-loader/

The logic:

    initiate the plugin: $(selector).hv_ajax_loader( configuration );

      This will add the template html to the selected element.

      

    switch on loader effect when loading starts: $(selector).hv_ajax_loader( 'switch', 'on' );

      The configuration's 'active' class is added to the base element.

   

    switch off when the request ends: $(selector).hv_ajax_loader( 'switch', 'off' );

      Removing the 'active' class.

 

 

Configuration options:

    delay: false

      The showing of the effect can be delayed. (msec) If the switch off method is

      called before the delay triggers the effect, it won't be shown.

    

    classes:

      base: 'hv_ajax_loader'

        The script will replace the '{{BASE_CLASS}}' string with this in the template.

        Basic styling can be done here.

        

      start: null

        If set, the script will add this class to the base element when calling the switch on method.

        

      active: 'active'

        After the time defined in the delay parameter elapsed, the class defined here will be added to the base element.

      

      custom: null

        If set, this class will be added to the base element upon initializing.

        Useful if the page contains multiple different ajax loaders.

        

      parent: null

        If set, this class will be added to the base element's parent upon initializing.

      

    template: '',

      The script will add this html code to the selected element.

    

    insert: 'append'

      'append' or 'prepend' the loader in the selected element.

      It only matters when the added element is inline, not absolute positioned.

    

Some example were set up in the index file.

Since the script don't mess with the styling, everything can be changed through the css classes.