Вот как вы можете отобразить простую загрузочную картинку во время обработки ваших запросов AJAX . Использование функций .ajaxStart () и .ajaxStop () обеспечит отображение загружаемого изображения для всех AJAX-запросов, запущенных на веб-странице.
Посмотреть демо
Код
Загрузка изображения
Вы также можете создать свой собственный анимированный GIF с помощью Online AJAX Image Tools .
Версия только для CSS
Это CSS для настройки загрузки изображения CSS во время загрузки вашего AJAX-запроса.
#loading { position:fixed; top:0px; right:50%; background:#fff; width:60px; height:20px; padding:0px; padding:4px; -moz-border-radius-topleft: 0px; -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; -webkit-box-shadow: 3px 3px 3px #0a0a0a; -moz-box-shadow: 3px 3px 3px #0a0a0a; box-shadow: 3px 3px 3px #0a0a0a; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 2px; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-right-color: #CCC; border-bottom-color: #CCC; border-left-color: #CCC; z-index: 999999; }