Отображение временного изображения при загрузке страницы

Question

Я разрабатываю веб-страницу, так как собираю данные с веб-страниц, поэтому загрузка занимает некоторое время.

Но в это время на заднем плане будет показана пустая страница. Мне нужно показать альтернативное изображение, пока страница не будет загружена. Помоги мне сделать это. заранее спасибо

Answer 1

Простое и аккуратное решение - использовать анимированный GIF-файл в div, который покрывает всю страницу и находится поверх всего остального, а затем, когда загрузка завершается, просто скрыть этот слой.

Это не требует Ajax и работает со времен IE4 (когда я впервые его использовал)

Answer 2

Попробуйте это;

1. Вам нужен именованный div, который содержит загружаемое изображение и для которого установлено значение none.
2. Создайте файл .js и создайте ссылку на него на каждой странице, для которой требуется загрузчик.
3. В JS вызовите метод, чтобы установить видимость div для блокировки (поместите его в вызов setTimeout, если хотите, так что он срабатывает только если загрузка страницы занимает более нескольких секунд).
4. Добавьте событие window.onload, чтобы установить режим отображения div обратно в none.

Единственная зависимость состоит в том, что, если вы ожидаете, что большая часть времени загрузки будет на стороне сервера, вы должны убедиться, что буферизация ответов позволяет странице загружаться до завершения обработки сервером. В любом случае, это удобный скрипт для страниц, загрузка которых из-за задержки в сети занимает некоторое время, просто убедитесь, что встраивание .js находится в голове.

Answer 3

если вы используете jquery ajax, вы можете использовать события. ajaxStart и. ajaxComplete для отображения того, что вы хотите

$("#loading").ajaxStart(function(){
    $(this).show();
});


$("#msg").ajaxComplete(function(event,request, settings){
    $(this).append("Request Complete.");
});