为什么我的滑块中的图像会同时加载？

Question

我不明白。 默认情况下启用延迟图像加载，我什至从类似的问题中尝试了这个 JavaScript（显然修复了它。也许它对我不起作用，因为我不使用 jquery？）。 我还尝试content-visibility: hidden ，直到我意识到 Firefox 或 Safari 甚至不支持它......（为什么？？？？）

let element = document.getElementsByTagName("img");

Array.from(element).forEach(i => {
    i.style.display = "block";
});

我认为另一个 slider 上的其他图像在我滚动到它之前仍然不会加载所以似乎确实有某种优化？ 老实说，我不能再说了。 对我来说，当我清除缓存和刷新时，它们似乎都试图一次加载所有内容。 我的目标是在图像实际显示并滚动到 slider 后加载图像，但我无法让它工作。 图片很大，我应该缩小它们的尺寸，但这对任何一种方式都有帮助。

Answer 1

你可以简单地使用CSS来完成它。提供display: none; 到所有默认幻灯片并应用display: block; 仅通过 CSS 激活幻灯片。这将解决您的问题。