Java script懒加载图片在GitHub网站上无法正常工作。

12 浏览
0 Comments

Java script懒加载图片在GitHub网站上无法正常工作。

我正在尝试在GitHub网站上延迟加载图片。当我在桌面上运行HTML文件时，我能够加载这些图片，但在GitHub网站上却不能。我查看了其他问题，如JavaScript文件在GitHub页面上不起作用，但这仅适用于HTTPS请求。

有人能帮我吗？

以下是代码：

document.addEventListener("DOMContentLoaded", function() {
  var lazyImages = [].slice.call(document.querySelectorAll("img.Images"));
  if ("IntersectionObserver" in window) {
    let lazyImageObserver = new IntersectionObserver(function(entries, observer) {
      entries.forEach(function(entry) {
        if (entry.isIntersecting) {
          let lazyImage = entry.target;
          lazyImage.src = lazyImage.dataset.src;
          lazyImage.srcset = lazyImage.dataset.srcset;
          lazyImage.classList.remove("Images");
          lazyImageObserver.unobserve(lazyImage);
		  lazyImage.classList.add("LazyImages");
        }
      });
    });
    lazyImages.forEach(function(lazyImage) {
      lazyImageObserver.observe(lazyImage);
    });
  } else {
    // 可能在这里回退到更兼容的方法
  }
});


.Images {
	width: 280px;
	height: 280px;
	padding: 10px;
	object-fit: cover;
}
.LazyImages {
	width: 280px;
	height: 280px;
	padding: 10px;
	object-fit: cover;
}

0