Плагин плавного появления изображений



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

Вероятно, вы тоже видели такой эффект на некоторых сайтах, на которых в публикациях много изображений. Я видел но как-то не задавался вопросом, как это работает.

Например, вы зашли на страницу, где автор разместил много фотографий достаточно большого размера, и, соответственно, большого “веса”. Серверу, на котором стоит такая страница, приходится загружать сразу все фотографии, даже те, которые вы еще не видите, так как они расположены ниже нижней границы вашего экрана монитора.

Вы начинаете читать публикацию, и на втором или третьем абзаце понимаете, что это вам не интересно. Дальнейшие ваши действия: вы закрываете эту страницу и идете дальше.

А сервер уже поработал, забрав часть времени у вас и у других посетителей. Загрузка страниц замедлилась.

Как этот недостаток обойти?

Как раз есть такой. Он не идеальный, но все же:

Плагин использует скрипт на языке Java. Сам плагин скрипта написан с использованием библиотеки jQuery, а в данном случае – автор написал плагин для WordPress, который автоматически подключает скрипт к работе вашего сайта.

Этот скрипт можно и напрямую прописать в файлы шаблона, но не многие владельцы сайтов это умеют. Плагин как раз вам поможет сделать это быстро – всего за два шага.

1. Скачиваете архив плагина.

2. Закачиваете его в папку wp-content/plugins удобным для вас способом.

3. В админке сайта заходите на страницу Плагины и активируете его.

Все, плагин работает. Он очень маленький, два рабочих файла + картинка. Все вместе “весит” 3Кб.

После активации плагина вы увидите эффект, который сейчас можете посмотреть по ссылке: http://www.appelsiini.net/projects/lazyload/enabled.html

Если вы размещаете много фотографий – советую воспользоваться этим плагином.

Да, на третьей версии плагин работает.

Скачать плагин

1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Отправить ответ

Оставьте первый комментарий!

avatar
wpDiscuz