Javascript spinning wait песочные часы
Я хотел бы указать пользователю веб-приложения, что выполняется длительная работа. Когда-то это понятие было бы сообщено пользователю, показывая песочные часы. В настоящее время это кажется анимированным кругом. (например, когда вы загружаете новую вкладку в Firefox или загружаетесь в Mac OS X. По совпадению, переполненный стек в логотипе stackoverflow выглядит как одна четверть круга).
Есть ли простой способ создать этот эффект с помощью Javascript (в частности, JQuery)? В идеале я хотел бы, чтобы один из этих маленьких прядильников был элементом в таблице, чтобы указать пользователю, что система все еще активна при обработке ожидающей задачи (т.е. Она не забыта или не разбилась). (Разумеется, я понимаю, что исходный код разбился, и интерфейс все еще отображается как оживляющая игра, это больше для психологической цели пользователя, видящего активность).
И как вы это называете?
Ответы
Ответ 1
Google "Индикатор активности Ajax", чтобы найти множество изображений и генераторов изображений (само "вращающееся" изображение является анимированным GIF).
Вот одна ссылка, чтобы вы начали:
http://www.ajaxload.info/
С изображением в руке используйте JQuery для переключения видимости изображения (или, возможно, его родительского тега DIV). См. Эту ссылку для получения дополнительной информации:
http://skfox.com/2008/04/28/jquery-example-ajax-activity-indicator/
гр
Ответ 2
этот сайт сделает это за вас:
ajaxload
и на OS X он назвал "Beachball", и мне нравится добавлять "Of Death".
Ответ 3
http://preloaders.net/en/letters_numbers_words хорош и имеет множество категорий в меню слева, которые предлагают более http://ajaxload.info, а также опции размера и фона... ajaxload выглядит довольно устаревшим в наши дни.
Ответ 4
Я предполагаю, что вы имели в виду что-то, указывающее фоновая активность во время вызова Ajax.
Я имею тенденцию иметь класс CSS, который устанавливает фоновое изображение в маленький анимированный GIF, с соответствующим заполнением и позиционированием (не забудьте выключить фоновое повторение), а затем добавьте и удалите этот класс, используя пару JavaScript-помощников, вызванных когда запускается вызов Ajax и когда выполняется обратный вызов ответа.