Lozad延迟加载插件，加载前图片显示链接断开

【问题标题】：Lozad lazy load plugin, images show broken link before loadingLozad延迟加载插件，加载前图片显示链接断开
【发布时间】：2019-10-03 18:09:35
【问题描述】：

我在图像网格上使用延迟加载插件 lozad。加载页面时，所有图像在加载前都会出现一秒钟的损坏链接缩略图。如果我向下滚动，当行进入视图时，它们也会在完全加载之前显示为断开的链接。我能做些什么来防止这种情况发生吗？

【问题讨论】：

标签： javascript html plugins lazy-loading

【解决方案1】：

您可以尝试设置 rootMargin 以便更早地加载图像。查看自述文件：

const observer = lozad('.lozad', {
    rootMargin: '10px 0px', // syntax similar to that of CSS Margin
    threshold: 0.1 // ratio of element convergence
});
observer.observe();

您还可以从断开的链接中设置外观样式，请参阅：https://bitsofco.de/styling-broken-images/

【讨论】：