Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.02.2015, 13:26
Профессор
Отправить личное сообщение для alerzo Посмотреть профиль Найти все сообщения от alerzo
 
Регистрация: 23.12.2010
Сообщений: 224

Индиактор загрузки страницы
Подскажите пожалуйста, что не правильно. Пытаюсь запускать индикатор загрузки в виде анимации, при ожидании загрузки страницы.
<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

Последний раз редактировалось alerzo, 07.02.2015 в 13:31.
Ответить с цитированием
  #2 (permalink)  
Старый 09.02.2015, 08:37
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

возможно ты мог заметить что выполняется не ajax, а полная перезагрузка контента, потому что стандартное действие для ссылки надо отменять. А еще неплохо бы исправить ошибки которые найдешь у себя в консоли.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
выполнение функции после загрузки страницы kowapos Общие вопросы Javascript 2 31.03.2014 02:57
Плавный скролл к якорю после загрузки страницы pro100lexx87 jQuery 7 17.01.2014 14:13
Событие загрузки кода страницы Oren2014 Opera, Safari и др. 2 05.12.2013 12:30
Как имитировать клик по элементу созданого после загрузки страницы? anoth3r jQuery 3 29.09.2011 12:22
Как сделать паузу после загрузки страницы? denisOgr AJAX и COMET 2 06.08.2011 15:01