https://altremedia.com/sitezscripts/jquery.unveil.js

1/**
2 * jQuery Unveil
3 * A very lightweight jQuery plugin to lazy load images
4 * http://luis-almeida.github.com/unveil
5 *
6 * Licensed under the MIT license.
7 * Copyright 2013 Luís Almeida
8 * https://github.com/luis-almeida
9 */
10
11;(function($) {
12
13  $.fn.unveil = function(threshold, callback) {
14
15    var $w = $(window),
16        th = threshold || 0,
17        retina = window.devicePixelRatio > 1,
18        attrib = retina? "data-src-retina" : "data-src",
19        images = this,
20        loaded;
21
22    this.one("unveil", function() {
23      var source = this.getAttribute(attrib);
24      source = source || this.getAttribute("data-src");
25      if (source) {
26        this.setAttribute("src", source);
27        if (typeof callback === "function") callback.call(this);
28      }
29    });
30
31    function unveil() {
32      var inview = images.filter(function() {
33        var $e = $(this);
34        if ($e.is(":hidden")) return;
35
36        var wt = $w.scrollTop(),
37            wb = wt + $w.height(),
38            et = $e.offset().top,
39            eb = et + $e.height();
40
41        return eb >= wt - th && et <= wb + th;
42      });
43
44      loaded = inview.trigger("unveil");
45      images = images.not(loaded);
46    }
47
48    $w.on("scroll.unveil resize.unveil lookup.unveil", unveil);
49
50    unveil();
51
52    return this;
53
54  };
55
56})(window.jQuery || window.Zepto);