Ajax Loader : генерируем картинку-индикатор
На любой странице, где используется аякс, надо каким то образом показать пользователю, что на сайте в данный момент что то происходит. Иначе посетитель подумает, что сайт не работает и просто закроет браузер. Нам это конечно не надо и поэтому мы покажем пользователю индикатор аякса в форме картинки gif, и когда аякс сделает своё дело - картинку спрячем.
Чтобы показать и спрятать картинку существует огромное количество способов. А где взять то саму картинку? Найти в интернете aнимированное изображение ещё пол беды. Надо чтобы эта картинка подходила к дизайну сайта. Вот тут на помощь приходит ресурс ajaxload. Ещё нигде я не видел такого лёгкого и быстрого способа сгенерировать для себя картинку-индикатор.
Выбираем тип картинки, цвет фона и цвет самого индикатора
и получаем свой уникальный анимированный Gif.
5 Comments so far
Leave a reply
Тут вот еще 12 других подобных - http://cssjuice.com/13-online-generators-for-web-20-design/
День добрый,
вот вы пишите что “Чтобы показать и спрятать картинку существует огромное количество способов.”
Подскажите пожалуйста какой-то простой скрипт как это сделать.
Исходно у меня есть php-скрипт (и не один) который секунд 10 обрабатывает данные, хочу сделать чтобы пока посетитель ждет эти 10 секунд он видел картинку loading.
К сожалению в Ajax не специалист, и простого решения на поисковиках не нашел.
Заранее спасибо.
Привет Максим,
мне нравится делать подобные манипуляции про помощи Prototype. Допустим есть картинка, у которой id=”myimage”.
Чтобы её спрятать, достаточно написать:
$('myimage').hide()Или чтобы показать:
$('myimage').show()Ну а если надо показать картинку при Ajax запросе, то у прототайпа есть для это специальные callbacks: onLoading, onSuccess. При загрузке (onLoading) картинку показываем, при завершении обработки (onSuccess) картинку прячем. Подробнее тут.
Александр, спасибо за ответ!
Не могли бы вы оставить ваш email, чтобы я мог задать несколько дополнительных вопросов?
Просто я не большой спец в javascript и тем более в Ajax.
написал тебе емайл на novell-admin.ru