javascript - 如何在延迟布局首次加载时显示第三张图片

Question

我在滑块上使用延迟布局https://github.com/OwlCarousel2/OwlCarousel2

  $(document).ready(function() {       
    $("#owl-demo").owlCarousel({
      items : 2,
      lazyLoad : true,
      navigation : true
    });      
  });

我的大问题是如何在视口上显示 3 个图像，滑块上仍然有 2 个项目，在我的示例图像上，滑块显示 2 个具有完整加载图像的项目和第三个具有默认/占位符图像的图像。

在此先感谢，我希望找到解决方案。

标签： javascripthtmldomowl-carousel

Answer 1

您可以将选项添加到设置对象，其中值指示将预加载 lazyLoadEager右侧（和左侧，当循环为 时）的项目数。true

    $(document).ready(function() {    
        $("#owl-demo").owlCarousel({
        items : 2,
        lazyLoad : true,
        lazyLoadEager:3,
        navigation : true
      });    
    });

更多关于延迟加载的信息可以在这里找到。