# 052: Галерея плавной загрузки, часть 2 - CSS-хитрости

Содержание

В котором мы выясняем проблемы, с которыми мы столкнулись с правильной загрузкой макета столбца. Исправление заключалось в удалении CSS, который заставлял поля-заполнители, поддерживающие соотношение сторон, работать после загрузки изображения (которое само по себе сохраняет соотношение сторон). Затем примените класс CSS, чтобы заставить работать «плавное появление» (изменение непрозрачности с 0 на 1). Легко глупо и всего лишь кусок JavaScript.

Следует отметить, что на живой версии сайта, к сожалению, этот крутой прием не сработает. Чтобы он был действительно эффективным, нам нужно знать соотношение сторон изображения на стороне сервера, мы можем мгновенно создать сетку с правильными заполнителями. К сожалению, у нас нет этой информации в реальной галерее. Мы можем использовать PHP для получения размеров, но это очень медленно. Вместо этого мы ждем, пока все изображения загрузятся, а затем их прозрачность исчезает. Не так круто и немного медленнее, но, по крайней мере, меньше дряблой загрузки.

Интересные статьи...