January 26, 2010 at 01:28AJAX in progress. Wait…
Usually
... in order to show the user that the web application is loading, an animated GIF is used like this:
A typical approach is:
1. show a spinning GIF in a corner or somewhere in a prominent place
2. start the download (XHttpRequest and Co.)
3. when the download is finished, remove the picture.
Idea
Use cursor animations to display application busyness.
Let's say in jQuery it’s enough to do this:
$("*").css("cursor", "wait");Return cursors:
$("*").css("cursor", "");This snippet will change the state of the cursor over all elements. However, why not limit yourself to a specific object?
$(".элементы_которые_грузятся").css("cursor", "wait");pros
* No changes in the markup structure
* No external elements are involved (you can, however, use your own * .cur files. A reliable source says that this feature is supported by all modern browsers)
* Very intuitive in itself
Minuses
* It looks like the browser is frozen (but if you use a non-standard cursor, it’s quite distinguishable)
* It looks different in different OSs (by the way, this is both a minus and a plus)
PS: while I was looking for a preloader, I accidentally found a site: www.loadinfo.net . There you can generate a beautiful preloader for yourself =)
Edit:
Here, for example, on such a thing, it would look very appropriate:
www.extjs.com/deploy/dev/examples/desktop/desktop.html
Edit2:
This cursor, in fact, even Better than wait:
$("*").css("cursor", "progress");