Дек 17

Анимированные gif`ы для ajax

Рубрики: jQuery Метки:  Количество просмотров: 2,349

Открыл для себя сервис, генерирующий гифчики, имитирующие индикаторы загрузки в стиле ajax.

Рецепт приготовления очень простой:

  1. В поле Indicator type выбираем внешний вид индикатора. Довольно большой выбор. Я бы даже сказал на любой вкус.
  2. Либо ставим фоновый цвет (Background color), либо выбираем прозрачность (Transparent background).
  3. Устанавливаем цвет (Foreground color).

Все, сервис генерирует анимированный gif файл для вашего ajax приложения.

Нагенерировать гифчиков можно тут:

http://www.ajaxload.info/

Другие статьи автора

Комментарии

  1. Цитировать Denis
    17 декабря 2008 в 14:15

    Такое в закладки сразу надо :D .
    Я для первого скрипта, работающего по ajax технологии в фотошопе за минут 5 нарисовал gif анимированный, но он был просто страшен. Оказывается решение было гораздо быстрее и качественнее…

  2. Цитировать Samborsky
    17 декабря 2008 в 14:28

    Denis

    Че страшен? Мне нравится. null

  3. Цитировать Denis
    17 декабря 2008 в 17:40

    Че страшен?

    Евгений, центр его вращения дергается :)
    Не знаю, наверное с первого взгляда это не заметно, но когда делаешь что-то – подобные мелочи мозолят глаза

  4. Цитировать Аня
    26 декабря 2008 в 2:59

    http://loadinfo.net/ – Этот гораздо лучше!

  5. Цитировать Samborsky
    26 декабря 2008 в 5:46

    Аня, неплохой выбор

  6. Цитировать IDDQD
    26 декабря 2008 в 6:59

    Ребят если Вам не трудно, подскажите как реализовать саму вставку этого чуда, в приложение на аяксе, к примеру, в Google AJAX Search API?

  7. Цитировать Samborsky
    26 декабря 2008 в 7:05

    С Google AJAX Search API пока не работал, но как в ajax jquery-приложении применить показать могу.

  8. Цитировать IDDQD
    26 декабря 2008 в 7:12

    http://depositfiles.com/files/m31ily695 вот я залил, посмотрите если не сложно)

  9. Цитировать Samborsky
    26 декабря 2008 в 7:20

    Я бы сперва подключил jQuery, затем

    Вот так выводится сама форма :

    <div class="search-control" id="search_control_tabbed">
      <div align="center" id="load"></div>
</div>

    Вот так меняем JavaScript код:

      <script src="http://www.google.com/jsapi"
     type="text/javascript"></script>
     <script language="Javascript" type="text/javascript">
      google.load('search', '1.0');

      function OnLoad() {

	/* Показываем гифчик */
	$('#load').html('<img src="load.gif" border="0" />');

        var tabbed = new google.search.SearchControl();
        tabbed.addSearcher(new google.search.WebSearch());
		tabbed.addSearcher(new google.search.ImageSearch());
		tabbed.addSearcher(new google.search.VideoSearch());
		tabbed.addSearcher(new google.search.NewsSearch());
        tabbed.addSearcher(new google.search.BlogSearch());
        var drawOptions = new google.search.DrawOptions();
        drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
        tabbed.draw(document.getElementById("search_control_tabbed"), drawOptions);

        tabbed.execute("");

	/* Убираем гифчик */
	$('#load').html('Загружено!');
      }
      google.setOnLoadCallback(OnLoad, true);
    </script>
  10. Цитировать IDDQD
    26 декабря 2008 в 7:33

    После вышеуказанных модификаций, ничего не работает(

  11. Цитировать Samborsky
    26 декабря 2008 в 7:37

    IDDQD, можешь составить html файл, и либо залить куда-нибудь, либо мне его переслать?

  12. Цитировать IDDQD
    26 декабря 2008 в 7:38

    можно с Вами по icq связатся?

  13. Цитировать Samborsky
    26 декабря 2008 в 7:39

    да, оставь свой номер или отправь его на samborskyv@gmail.com, я стукну

  14. Цитировать IDDQD
    26 декабря 2008 в 7:40

    494210842

  15. Цитировать Тимур
    23 января 2009 в 17:22

    http://preloaders.net
    Функций намного больше, и прелоадеров тоже.

  16. Цитировать Samborsky
    24 января 2009 в 12:12

    Тимур, спасибо, нашел несколько симпатичных «крутилок»

  17. Цитировать Андрей Сорвин
    30 сентября 2009 в 6:23

    Спасибо, отличный сервич!
    Тоже решил заменить свои аяксовские гифки на сгенерированные =)

    А нельзя ли сервис более уникализировать? Было бы здорово самостоятельно как-нибудь волшебным образом нарисовать анимацию прямо на сайте, или же загрузить откуда-нибудь. А потом изменить цвета..

  18. Цитировать Андрей Сорвин
    30 сентября 2009 в 6:30

    прошу прощения, невнимательно прочитал пост. Не увидел, что это сторонний сервис.

Добавить комментарий