blob: 50cc8c46e21868c0b0dfb0da0ebc26459a208a92 (
plain)
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
|
(function(){
if (!('IntersectionObserver' in window)) {
return;
}
// Now we're here, we can assume quite modern JavaScript!
const observer = new IntersectionObserver(onIntersection, {
rootMargin: "50px 0px"
});
const images = document.querySelectorAll(".js-lazyload");
images.forEach(image => {
observer.observe(image);
});
function onIntersection(entries, observer) {
entries.forEach(entry => {
if (entry.intersectionRatio > 0) {
// Loading the image is the only thing we care about, so can
// stop observing.
observer.unobserve(entry.target);
// Removing this class (which is suppressing background-image)
// will trigger the image load
entry.target.classList.remove('js-lazyload');
}
});
}
})();
|
