Chrome 本机图像延迟加载仅在 iframe 内有效
Chrome 81、FF 75（今天最新）
在 Chrome 中，本机图像延迟加载仅在 iframe 内起作用。为什么？在 FF 效果很好
page1.htm（延迟加载在 Chrome 中不起作用，但在 FF 中运行良好）：
<p style="margin-bottom: 1000px;">Please scroll down. The image is below the viewport.</p>
<p style="margin-bottom: 1000px;">Please scroll down. The image is below the viewport.</p>
<img src="https://wallpaperplay.com/walls/full/5/e/a/218959.jpg" loading="lazy">
page2.htm（通过 iframe 进行延迟加载在 Chrome 和 FF 中均有效）：
<iframe src="page1.htm">
这是Chrome的bug吗？在FF中效果很好
（您可以通过滚动和开发者工具 -> 网络检查图像延迟加载）
沧海一幻觉浏览 118回答 2
2回答
-
喵喔喔
我遇到了同样的问题，但只有当图像足够接近视口时才会出现。否则它会被延迟加载。请尝试在 Chrome 中打开这个最小的工作示例，然后慢慢向下滚动页面。当视口大约位于页面中间时，将加载图像。<html> <head> <style> .dummy { height: 700vh; } </style> </head> <body> <div class="dummy"></div> <img src="https://yasminfinch.com/wp-content/uploads/2015/03/Hello-icon-300x212.jpg" loading="lazy"> </body></html>如果没有信心，我可以认为这是一个功能，而不是一个错误。某种优化。例如，当用户足够快地向上/向下滚动时，它会减少看到图像正在加载的机会。 -
PIPIONE
就我而言，我必须width在内联或在 CSS 文件中显式设置属性。其实你可以尝试一下原来的demo。如果您在此演示中删除宽度和高度属性，则 Chrome 上的延迟加载将不起作用。
随时随地看视频慕课网APP
相关分类
Html5