Обычно
… для того, чтобы показать пользователю, что на фоне веб-приложения идет загрузка используется анимированная гифка вроде этой:
Типичный подход при этом:
1. показать крутящуюся гифку в углу или где-нибудь на видном месте
2. начать загрузку (XHttpRequest и Ко)
3. когда загрузка заканчивается, убираем картинку.
Идея
Использовать анимацию курсора для отображения занятости приложения.
Скажем, в jQuery для этого достаточно выполнить:
$("*").css("cursor", "wait");Вернуть курсоры:
$("*").css("cursor", "");Данный сниппет поменяет состояние курсора над всеми элементами. Однако, почему бы и не ограничиться каким-нибудь конкретным объектом?
$(".элементы_которые_грузятся").css("cursor", "wait");Плюсы
* Никаких изменений в структуре разметки
* Не задействовано никаких внешних элементов (можно, правда, использовать собственные *.cur файлы. Достоверный источник сообщает, что эта фича поддерживается всеми современными браузерами)
* Весьма интуитивно само по себе
Минусы
* Выглядит, как будто завис браузер (но если использовать нестандартный курсор, вполне отличимо)
* В разных ОСях выглядит по-разному (кстати, это и минус и плюс)
P.S.: пока искал прелоадер, случайно нашел сайт: www.loadinfo.net. Там можно сгенерить себе красивый прелоадер =)
Edit:
Вот, например, на подобной штуке, это выглядело бы очень уместно:
www.extjs.com/deploy/dev/examples/desktop/desktop.html
Edit2:
Вот этот курсор, собственно, даже лучше подходит, чем «wait»:
$("*").css("cursor", "progress");
