https://adalet.az/frontend/lazyload/main.js

1/* LazyLoad.js (c) Fonksiyonu
2* Yapımcı: Lorenzo Giuliani
3* Kullanım: Görsellerin HTML kodunun şu şekilde düzenlenmesi gerekir:
4* `<img src="blank.gif" data-src="Görsel.png" width="600" height="400" class="lazy">`
5*/
6
7!function(window){
8    var $q = function(q, res){
9          if (document.querySelectorAll) {
10            res = document.querySelectorAll(q);
11          } else {
12            var d=document
13              , a=d.styleSheets[0] || d.createStyleSheet();
14            a.addRule(q,'f:b');
15            for(var l=d.all,b=0,c=[],f=l.length;b<f;b++)
16              l[b].currentStyle.f && c.push(l[b]);
17            a.removeRule(0);
18            res = c;
19          }
20          return res;
21        }
22      , addEventListener = function(evt, fn){
23          window.addEventListener
24            ? this.addEventListener(evt, fn, false)
25            : (window.attachEvent)
26              ? this.attachEvent('on' + evt, fn)
27              : this['on' + evt] = fn;
28        }
29      , _has = function(obj, key) {
30          return Object.prototype.hasOwnProperty.call(obj, key);
31        }
32      ;
33    function loadImage (el, fn) {
34      var img = new Image()
35        , src = el.getAttribute('data-src');
36      img.onload = function() {
37        if (!! el.parent)
38          el.parent.replaceChild(img, el)
39        else
40          el.src = src;
41        fn? fn() : null;
42      }
43      img.src = src;
44    }
45    function elementInViewport(el) {
46      var rect = el.getBoundingClientRect()
47      return (
48         rect.top    >= 0
49      && rect.left   >= 0
50      && rect.top <= (window.innerHeight || document.documentElement.clientHeight)
51      )
52    }
53      var images = new Array()
54        , query = $q('img.lazy')
55        , processScroll = function(){
56            for (var i = 0; i < images.length; i++) {
57              if (elementInViewport(images[i])) {
58                loadImage(images[i], function () {
59                  images.splice(i, i);
60                });
61              }
62            };
63          }
64        ;
65      for (var i = 0; i < query.length; i++) {
66        images.push(query[i]);
67      };
68      processScroll();
69      addEventListener('scroll',processScroll);
70  }(this);