Ajax анимация и загрузка

Хотел сделать колекцию анимаций загрузок для ajax приложений, но перед этим решил порыть гугл. В итоге оказалось, что смысла нет рисовать что-то новое, потому как универсального полным полно, а специфическое каждый уважающий себя дизайнер нарисует сам, для каждого проекта своё. Вот, например, существует даже генератор анимированых иконок Ajaxload.info, в колекции которого десятки анимаций и на выбор полный RGB цветов, как для фона, так и для… (задумался как перевести foreground).

Вам вопрос, уважаемые читатели, как правильно и по-русски понятно перевести слово foreground?

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

Но вот в чём загвоздка.

Пользователь не знает когда же данные эти загрузятся и загрузятся ли вообще и стоит ли ждать? В принципе, это одна из старых догм: “не пиши слово ‘загрузка’! “, которая больше применялась ко Flash приложениям. Вроде бы времена изменились и скорости увеличились и Ajax работая с текстом, должен довольно быстро получать данные. Но встречаются сервисы в которых нужно ждать даже около 10 секунд, чтобы дождаться появления содержимого. Конечно не сравниться с флэш-приложениями, которые могут загружаться по полминуты, а то и больше. Но у флэш есть индикатор загрузки. А у ajax-based приложений его нет.

Что же делать?

Ждать. Ждать пока кто-нибудь из производителей браузеров или консорциум родит концепцию расширения третьего статуса (receiving) свойства readyState, с возвращением количества байтов загруженных с сервера. Того же хотелось бы относительно загрузки картинок, а то раздражают картинки очень долго загружаемые сверху вниз. Лучше когда они показываются полностью но в плохом качестве, и по мере загрузки картинки качество улучшается. Кое-где я такое видел, но вроде это от браузера зависит? Поправьте меня.

Дата: 27.08.2007
»
Категории: JavaScript
Google     

]]> 4m@t!c ]]>

Погугили по фразе “ajax upload progress bar” и ты узнаешь много нового. Насчет улучшения качества по мере загрузки – это атрибут Interlaced графического файла в формате gif. Опять же гугили, что бы узнать больше.

»

]]> Никита ]]>

Я имел в виду о прогресс-баре средствами Ajax, т. е. JavaScript. А не установкой расширений для php, использвования ruby, perl и тому подобные танцы с бубном. И сравнивал с Flash, который использует свои собственные методы. Насчёт картинок, понятно, спасибо. Значит мои слова остаются в силе. Хочу браузерного решения проблемы. :)

»

]]> Maxoud ]]>

Насчет картинок плохого качества: был такой аттрибут img lowsrc=”path/to/low-source-image”. Но, по-моему его нет в XHTML.
Как вариант -
div style=”background:url(‘low/source/image’)”,
а в нем HQ img

»

]]> Верайс ]]>

foreground – передний план

пс. При написании комментария русскими буквами каждая буква дублируется! ННааппррииммеерр…

»

]]> Евгений Голубев ]]>

Maxoud – ты не совсем прав.

По поводу изображений смотрим Википедию (РУС) по статье JPEG. Необходимую выдержку привожу ниже =)

Progressive JPEG — такой способ записи сжатого изображения в файл, при котором старшие (низкочастотные) коэффициенты находятся в начале файла. Это позволяет получить уменьшенное изображение при загрузке лишь небольшой части файла и повышать детализацию изображения по мере загрузки оставшейся части. Поэтому Progressive JPEG получил широкое распространение в Internet.

Вот и вся магия.

»

]]> Никита ]]>

Maxoud, да действительно lowsrc очень старый атрибут, уже даже в HTML 4.01 нет. Но зато он есть в javascript как свойство этой картинки.

Верайс, точно! спасибо!
А насчёт набора русскими буквами, не замечал. Каким браузером пользуетесь?

Евгений Голубев, он прав, но только в том что сказал. ))
Ну вот. Всё никак руки не доходили порыться, что означает галочка progressive. Теперь ясно.

»

Напишите комментарий