Динамическая загрузка изображений во время прокрутки на jQuery

28 апреля 2015  3628  jQuery

 

Простое расширение JQuery для динамической загрузки изображений во время прокрутки. Предназначен для работы с изображениями тяжелых веб-сайтов, чтобы сохранить пропускную способность и уменьшить время загрузки. Поддерживается Google Chrome, Safari (Desktop & Mobile), Internet Explorer (8, 9, 10+), Firefox.

Расширение — LoadScroll. Автор — Nathan Rutzky.

Источник — https://github.com/nathco/jQuery.loadScroll

Исходник — скачать архив

Подключаем библиотеку jQuery (при необходимости), скрипт и функцию расширения.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="/js/loadScroll.js"></script>
<script> $(window).load(function() { $('img').loadScroll(); }); </script>

Размечаем страницу.

<!-- видимые изображения -->
<img src="/images/01.jpg" alt=""> <img src="/images/02.jpg" alt=""> <img src="/images/03.jpg" alt="">
...
<!-- подгружаемые изображения -->
<img data-src="/images/15.jpg" alt=""> <img data-src="/images/16.jpg" alt=""> <img data-src="/images/17.jpg" alt="">
...

Пример.

 

Комментарии для сайта Cackle
наверх