Подскажите пожалуйста, что не правильно. Пытаюсь запускать индикатор загрузки в виде анимации, при ожидании загрузки страницы.
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
/*описание стилей*/
#loadImg{position:absolute; z-index:1000; display:none}
</style>
<a href="http://www.kinopoisk.ru/top/navigator/"onclick="startLoadingAnimation();">Запускаем загрузку</a>
<img id="loadImg" src="ajax-loader.gif" />
<script>
startLoadingAnimation();
$.get("http://www.kinopoisk.ru/top/navigator/", onAjaxSuccess); // - отправим запрос на сервер // - запустим анимацию загрузки
function onAjaxSuccess(data) // - функция завершения запроса
{
stopLoadingAnimation();
}
function startLoadingAnimation() // - функция запуска анимации
{
// найдем элемент с изображением загрузки и уберем невидимость:
var imgObj = $("#loadImg");
imgObj.show();
// вычислим в какие координаты нужно поместить изображение загрузки,
// чтобы оно оказалось в серидине страницы:
var centerY = $(window).scrollTop() + ($(window).height() + imgObj.height())/2;
var centerX = $(window).scrollLeft() + ($(window).width() + imgObj.width())/2;
// поменяем координаты изображения на нужные:
imgObj.offset(top:centerY, left:centerX);
}
function stopLoadingAnimation() // - функция останавливающая анимацию
{
$("#loadImg").hide();
}
</script>
Тестирую в песочнице :
http://learn.javascript.ru/play/QtKA0
