Jquery OwlCarousel在背景中预加载图像

我使用的是owlcarousel 2，lazyload选项为true，我想在用户看到转盘的第一张图像时开始在后台预加载下一张幻灯片图像，这样用户就不会看到加载器，而是直接在下一张幻灯片中看到加载的图像

这是我的html代码

<div class="inner-gallery">
  <div id="inner-gallery">
   <div class="gallery-item">
         <div class="gallery-item2">  
           <img class="lazyOwl" data-src="<?php echo $image[0]; ?>" alt=""/>
         </div>
   </div>
  </div>
</div>

---

不知道为什么，但我的第一项是2，所以我必须将总数增加2

var mycarousel = $('#inner-gallery');

mycarousel.on('loaded.owl.lazy', function(event) {

    var nextpic = new Image();
    var totitem = event.item.count + 2;     
    var nextitem = event.item.index + 1;

    if (nextitem <= totitem) {
        var imgsrc = $(event.target).find('.gallery-item').eq(nextitem).find('img').data('src');
        nextpic.src = imgsrc;
    }

}); 

var mycarousel=$（“#内部画廊”）；
mycarousel.on（'loaded.owl.lazy'，函数（事件）{
var nextpic=新图像（）；
var totitem=event.item.count+2；
var nextitem=event.item.index+1；
如果（nextitem不确定为什么，但我的第一项是2，所以我必须将总数增加2

var mycarousel = $('#inner-gallery');

mycarousel.on('loaded.owl.lazy', function(event) {

    var nextpic = new Image();
    var totitem = event.item.count + 2;     
    var nextitem = event.item.index + 1;

    if (nextitem <= totitem) {
        var imgsrc = $(event.target).find('.gallery-item').eq(nextitem).find('img').data('src');
        nextpic.src = imgsrc;
    }

}); 

var mycarousel=$（“#内部画廊”）；
mycarousel.on（'loaded.owl.lazy'，函数（事件）{
var nextpic=新图像（）；
var totitem=event.item.count+2；
var nextitem=event.item.index+1；
如果（nextitem遵循al404IT回答，我设法让转盘以这种方式预加载下一幅图像。
当我展示下一幅图像的一部分时，我还需要使下一幅图像可见

mycarousel.on('loaded.owl.lazy', function(event) {
    var totitem = event.item.count + 2;
  var nextitem = event.item.index + 1;
  if (nextitem <= totitem) {
    var imgsrc = $(event.target).find('.item').eq(nextitem).find('img').data('src');
    console.log($(event.target).find('.item').eq(nextitem).find('img').attr("src"));
    $(event.target).find('.item').eq(nextitem).find('img').attr("src", imgsrc).css("opacity", "1");
  }
});

mycarousel.on（'loaded.owl.lazy'，函数（事件）{
var totitem=event.item.count+2；
var nextitem=event.item.index+1；
如果（nextitem遵循al404IT回答，我设法让转盘以这种方式预加载下一幅图像。
当我展示下一幅图像的一部分时，我还需要使下一幅图像可见

mycarousel.on('loaded.owl.lazy', function(event) {
    var totitem = event.item.count + 2;
  var nextitem = event.item.index + 1;
  if (nextitem <= totitem) {
    var imgsrc = $(event.target).find('.item').eq(nextitem).find('img').data('src');
    console.log($(event.target).find('.item').eq(nextitem).find('img').attr("src"));
    $(event.target).find('.item').eq(nextitem).find('img').attr("src", imgsrc).css("opacity", "1");
  }
});

mycarousel.on（'loaded.owl.lazy'，函数（事件）{
var totitem=event.item.count+2；
var nextitem=event.item.index+1；
如果（nextitem文档提供了LazyLoadEarge选项：

因此，在选项中添加“lazyLoadEager:1”就可以了。
文档提供了一个lazyLoadEager选项：

因此，在选项中添加“LazyLoadEarge:1”就可以了。
您可以在选项中添加一个回调
onLazyLoaded
。版本2的文档不充分，至少对我来说是这样，但是如果您在旋转木马中找到了下一项，则可以使用类似
var nextPic=new image（）的内容预加载图像；nextPic.src=$（nextItem）.find（'img'）.attr（'data-src'）；
你找到解决方案了吗？你可以在选项中添加一个回调
onLazyLoaded
。版本2的文档不够，至少对我来说是不够的，但是如果你在旋转木马中找到了下一个项目，图像可以用类似
var nextPic=new image（）的东西预加载；nextPic.src=$（nextItem）.find（'img'）.attr（'data-src'）；
找到解决方案了吗？