lazy img

lazy-img.css

@@ -0,0 +1,8 @@
+img[loading='lazy'] {
+  opacity: 0;
+  transition: opacity 0.5s ease !important;
+}
+
+img.loaded {
+  opacity: 1;
+}

lazy-img.js

@@ -0,0 +1,14 @@
+document.addEventListener("DOMContentLoaded", function() {
+  /*var cssLink = document.createElement("link");
+  cssLink.rel = "stylesheet";
+  cssLink.href = "/cssjs/lazy-img.css";
+  document.head.appendChild(cssLink);*/
+
+  var images = document.querySelectorAll('img[loading="lazy"]');
+
+  images.forEach(function(image) {
+    image.onload = function() {
+      image.classList.add('loaded');
+    };
+  });
+});

lazy-img.min.js

@@ -0,0 +1 @@
+document.addEventListener("DOMContentLoaded",function(){document.querySelectorAll('img[loading="lazy"]').forEach(function(n){n.onload=function(){n.classList.add("loaded")}})});