Рады видеть Вас в блоге нашей студии! Здесь мы копим нужную, а иногда просто интересную информацию о создании сайтов.
jQuery Lazyload - «Ленивая загрузка» фотографий с помощью jQuery
«Ленивая загрузка» - это программный плагин jQuery, написанный на JavaScript, который откладывает загрузку изображений на (больших) веб-страницах. Таким образом, изображения, которые не попадают в поле зрения пользователя, не будут открываться до тех пор, пока пользователь не прокрутит страницу вниз. То же самое, что предварительная загрузка, только наоборот.
Программный плагин основан на jQuery (ну а как же?) и переменных, разработанных Брендоном Аароном, которые теперь включены в разметку jQuery.
Укажите их в заголовке:
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.lazyload.js" type="text/javascript"></script>
И в коде:
$("img").lazyload();
Установка реагирования
$("img").lazyload({ threshold : 200 });
Если вы установите пороговое значение 200, то до начала открытия 200 пикселей картинки уже будут загружены.
Метка-заполнитель для изображения
$("img").lazyload({ placeholder : "img/grey.gif" });
Событие для начала загрузки
$("img").lazyload({
placeholder : "img/grey.gif",
event : "click"
});
Использование эффектов
$("img").lazyload({
placeholder : "img/grey.gif",
effect : "fadeIn"
});