CVI
busy.js 1.3 allows you to add/remove loading indicators to html elements (or viewport) on your webpages (inc. overlay color & transparency). It uses unobtrusive javascript to keep your code clean. Requires no plugin/extension or any other external resource!

It works in all the major browsers - Mozilla Firefox 1.5+, Opera 9+, Safari and IE6+. On older browsers, it'll degrade to simple quadratic shapes.

Demonstration

Click to see what cvi_busy_lib.js can do.

click
Clickable Demo
ajax
AJAX Demo
demo
WYSIWYG Demo

Setting Up

Download cvi_busy_lib.js and include it into your webpage.

<script type="text/javascript" src="cvi_busy_lib.js"></script>

Using It

Add overlay to element
ctrl = getBusyOverlay(parent[, overlay[, busy]]);
parent  == element to add the overlay to or "viewport"
overlay      e.g. {color: 'black', opacity: 0.5, ...}
color   == STRING 'black' or '#000000' or 'rgb(0,0,0)' Default: 'white'
opacity == FLOAT 0.0 - 1.0 Default: 0
text    == STRING e.g. 'loading' Default: ''
style   == STRING e.g. 'color: black;' or 'my_text_class' Default: ''
busy         e.g. {color: '#000', size: 32, ...}
color   == STRING '#000000' or '#000' Default: '#000'
size    == INT 16 - 512 Default: 32
type    == STRING 'circle|oval|polygon|rectangle|tube' or 'c|o|p|r|t' Default: 'tube'
iradius == INT 6 - 254 Default: 8
weight  == INT 1 - 254 Default: 3
count   == INT 5 - 36 Default: 12
speed   == INT 30 - 1000 Default: 96
minopac == FLOAT 0.0 - 0.5 Default: 0.25

Edit overlay text
ctrl.settext(STRING);

Remove overlay from element
ctrl.remove();

Examples
if(typeof $=='undefined') {function $(v) {return(document.getElementById(v));}}
ctrl = getBusyOverlay("viewport");
ctrl = getBusyOverlay($('box'));
ctrl = getBusyOverlay($('box'), {opacity:0.5});
ctrl = getBusyOverlay($('box'), {}, {size:16});
ctrl = getBusyOverlay($('box'), {color:'blue', opacity:0.25}, {type:'oval'});
ctrl.settext('Ready...!');
ctrl.remove();
try {ctrl.remove(); delete ctrl;} catch(e) {}
if(typeof(ctrl)=='object') {ctrl.remove(); ctrl="";}

Why use Javascript cvi_busy_lib?

In older browsers, the script degrades to simple quadratic shapes.

Download

Please read the license before you download busy.js 1.3

F.A.Q.

Please read the Frequently Asked Questions before you contact the author.

History

Version 1.3

Version 1.21

Version 1.2

Version 1.1

Version 1.0

Contact

Please leave any comments at this contact formular.

License

cvi_busy_lib.js is distributed under the Netzgestade Non-commercial Software License Agreement.
License permits free of charge use on non-commercial and private web sites only under special conditions (as described in the license). This license equals neither "open source" nor "public domain". There are also Commercial Software Licenses available.

YOU AGREE TO ALL CONDITIONS OF THIS LICENCE AGREEMENT CONCERNING THE USE OF THE SOFTWARE BY ACCEPTING THIS LICENCE.
IF YOU DO NOT AGREE TO ALL CONDITIONS OF THIS AGREEMENT, YOU SHALL NOT INSTALL THE SOFTWARE, OR USE IT IN OTHER WAYS.

Other Projects

busy.netzgesta.de © 2024 by Christian Effenberger :: Imprint feed   twitter   facebook   myspace   delicious   digg   reddit   magnoliacom   newsvine   furl   google   yahoo   blinklist   mister-wong