Javascript крутится в ожидании песочных часов

Question

Я хотел бы указать пользователю веб-приложения, что выполняется долгосрочное задание. Давным-давно, эта концепция была бы доведена до пользователя путем отображения песочных часов. В настоящее время это, кажется, оживленный кружащийся круг. (например, когда вы загружаете новую вкладку в Firefox или загружаетесь в Mac OS X. По совпадению переполняющийся стек в логотипе stackoverflow выглядит как одна четверть круга).

Есть ли простой способ создать этот эффект с помощью Javascript (в частности, JQuery)? В идеале я хотел бы иметь один из этих маленьких счетчиков в качестве элементов в таблице, чтобы указать пользователю, что система все еще активна в обработке ожидающей задачи (то есть она не забыла и не потерпела крах). (Конечно, я понимаю, что возможно, что серверная часть потерпела крах, и интерфейс все еще отображается как оживляющая вращающаяся вещь, это больше для психологической цели, когда пользователь видит активность).

А как ты вообще называешь эту вращающуюся вещь?

Answer 1

Google Индикатор активности Ajax для поиска множества изображений и генераторов изображений (само "вращающееся" изображение представляет собой анимированный GIF).

Вот одна ссылка , чтобы вы начали.

Имея изображение в руке, используйте JQuery для переключения видимости изображения (или, возможно, его родительского тега DIV). См. эту ссылку для получения дополнительной информации.

гр

Answer 2

этот сайт сделает это за вас:

ajaxload

и в OS X он называется "Beachball", и мне нравится добавлять "Of Death".

Answer 3

http://preloaders.net/en/letters_numbers_words приятно и имеет много категорий в левом меню, которые предлагают больше, чем http://ajaxload.info, плюс опции размера и фона ... ajaxload выглядит довольно устаревшим в наши дни.

Answer 4

Полагаю, вы имели в виду что-то, что указывало на фоновую активность во время вызова Ajax.

У меня, как правило, есть класс CSS, который задает фоновое изображение для небольшого анимированного GIF с соответствующими отступами и позиционированием (не забудьте отключить повторение фона), а затем добавляю и удаляю этот класс с помощью пары помощников JavaScript, называемых когда запускается Ajax-вызов и когда выполняется ответный обратный вызов.