mediawiki-skins-Citizen/resources/scripts/lazyload.js

40 lines
1.5 KiB
JavaScript
Raw Normal View History

2019-08-15 17:40:13 +00:00
/*
* Citizen - Lazyload JS
* https://starcitizen.tools
*
* Lazyloading images with Native API or IntersectionObserver
*/
// Native API
if ("loading" in HTMLImageElement.prototype) {
document.querySelectorAll("img.lazy").forEach(function(img) {
img.setAttribute("src", img.getAttribute("data-src"));
if (img.hasAttribute("data-srcset")) {
img.setAttribute("srcset", img.getAttribute("data-srcset"));
2019-08-15 17:40:13 +00:00
}
2019-08-16 02:48:10 +00:00
img.classList.remove("lazy");
});
} else {
// IntersectionObserver API
if (typeof IntersectionObserver !== "undefined" && "forEach" in NodeList.prototype) {
var observer = new IntersectionObserver(function(changes) {
if ("connection" in navigator && navigator.connection.saveData === true) {
return;
2019-08-15 17:40:13 +00:00
}
changes.forEach(function(change) {
if (change.isIntersecting) {
change.target.setAttribute("src", change.target.getAttribute("data-src"));
if (change.target.hasAttribute("data-srcset")) {
change.target.setAttribute("srcset", change.target.getAttribute("data-srcset"));
}
2019-08-16 02:48:10 +00:00
change.target.classList.remove("lazy");
observer.unobserve(change.target);
}
});
2019-08-15 17:40:13 +00:00
});
document.querySelectorAll("img.lazy").forEach(function(img) {
observer.observe(img);
});
}
2019-08-15 17:40:13 +00:00
}