Ненавязчивый индикатор загрузки изображения на iphone - PullRequest
0 голосов
/ 19 сентября 2011

Я ищу простой способ реализации индикатора загрузки для элементов img для Mobile Safari (и, возможно, других мобильных агентов).На первый взгляд, использование background: свойство для таких элементов кажется правильным.Однако есть две проблемы:

  • Агенты обычно начинают рендеринг уже при загрузке только части изображения.Это выглядит довольно странно в сочетании с изображением индикатора загрузки.
  • Я бы хотел применить анимацию вращения css3 (вращение) к индикатору загрузки (а не к конечному изображению).

Установка свойства content css в '', и простой тег класса, который указывает, что изображение загружается, будет работать вокруг этого.К сожалению, это также как-то мешает Mobile Safari выполнять анимацию (хотя в Chrome это работает нормально).

Другие (и, возможно, лучшие) решения будут включать несколько элементов, но я специально пытаюсь предотвратить это.Псевдоклассы CSS: before или: after также не работают в сочетании с анимацией.

Моя попытка при этом: https://gist.github.com/1225523#file_loading.html

Есть предложения?

1 Ответ

1 голос
/ 19 сентября 2011

Я бы предложил spin.js, который полностью основан на CSS3 и не использует изображения.Вы можете легко настроить свой счетчик.

SPIN.JS

...