-
Notifications
You must be signed in to change notification settings - Fork 61
Expand file tree
/
Copy pathlazy.js
More file actions
80 lines (71 loc) · 2.31 KB
/
lazy.js
File metadata and controls
80 lines (71 loc) · 2.31 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
/* lazyload.js (c) Lorenzo Giuliani
* MIT License (http://www.opensource.org/licenses/mit-license.html)
*
* expects a list of:
* `<img src="blank.gif" data-src="my_image.png" width="600" height="400" class="lazy">`
*/
!function (window) {
var $q = function (q, res) {
if (document.querySelectorAll) {
res = document.querySelectorAll(q);
} else {
var d = document
, a = d.styleSheets[0] || d.createStyleSheet();
a.addRule(q, 'f:b');
for (var l = d.all, b = 0, c = [], f = l.length; b < f; b++)
l[b].currentStyle.f && c.push(l[b]);
a.removeRule(0);
res = c;
}
return res;
}
, addEventListener = function (evt, fn) {
window.addEventListener
? this.addEventListener(evt, fn, false)
: (window.attachEvent)
? this.attachEvent('on' + evt, fn)
: this['on' + evt] = fn;
}
, _has = function (obj, key) {
return Object.prototype.hasOwnProperty.call(obj, key);
}
;
function loadImage(el, fn) {
var img = new Image()
, src = el.getAttribute('data-src');
img.onload = function () {
if (!!el.parent)
el.parent.replaceChild(img, el)
else
el.src = src;
fn ? fn() : null;
}
img.src = src;
}
function elementInViewport(el) {
var rect = el.getBoundingClientRect()
return (
rect.top >= 0
&& rect.left >= 0
&& rect.top <= (window.innerHeight || document.documentElement.clientHeight)
)
}
var images = new Array()
, query = $q('img.lazy')
, processScroll = function () {
for (var i = 0; i < images.length; i++) {
if (elementInViewport(images[i])) {
loadImage(images[i], function () {
images.splice(i, i);
});
}
};
}
;
// Array.prototype.slice.call is not callable under our lovely IE8
for (var i = 0; i < query.length; i++) {
images.push(query[i]);
};
processScroll();
addEventListener('scroll', processScroll);
}(this);