Давайте представим, что у вас на странице имеются большие картинки, и вы хотите, чтобы пользователь знал, что они загружаются. С помощью JavaScript'а можно внедрить анимированную иконку ко всем изображениям, которые еще не загружены, но мы можем предложить вам более простой и чистый способ.
Шаг 1: Найдите анимированную иконку
Существует много сайтов, где вы можете создать свою картинку для загрузчика. Наш любимый этот. Главное не выбирайте иконку, которая будет очень много весить. Вот такую сгенерировали мы:
Шаг 2: Добавьте CSS-правила
Тут совсем немного кода, и вы можете просто скопировать его. Только не забудьте сменить «youricon.gif» на свою картинку.
.load {
background: url('images/youricon.gif') no-repeat center;
}