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

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

jQuery

Подключаем библиотеку 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>

HTML


<!-- видимые изображения -->
<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="">
...

Пример

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

Апсолямов Михаил
Автор — Михаил Апсолямов
Продвигаю бизнес в интернете: разработка стратегии, создание сайта, SEO, контент-маркетинг, SMM, обслуживание и техподдержка проектов. Опыт — 15 лет. Подробнее
наверх