Owl 带延迟加载选项的轮播 2

Question

我在一个项目中使用 Owl Carousel 2，它运行良好。

我想延迟加载每个项目中的图像。值得庆幸的是，Owl Carousel 2 有一个内置选项。但是，没有选项可以抢先延迟加载下一个或两个项目（尚未在视口中）中的图像。

有没有其他人遇到过这个问题或者有什么解决方案可以提供？

例如，在 this demo 中，有四张幻灯片在查看。但我希望先发制人地加载幻灯片 5 和 6 中的图像。当您滚动浏览轮播时，接下来要显示但尚未显示的幻灯片也应该在它们变得可见之前开始加载。

Answer 1

您可以尝试添加lazySizes。 lazySizes 是第三方 lazyloader，它会自动检测附近的视图图像，因此无需配置即可与许多滑块一起使用。

如果您想强制预加载，您还可以添加 class lazypreload.

这里有两个例子：

• lazySizes with flexslider
• lazySizes with Flickity

请注意，您可能需要 specify the image dimensions。