Javascript 帮助古奇式猫头鹰旋转木马

我尽我所能为一个时尚网站创建了一个猫头鹰旋转木马，我想要一个与gucci.com类似的。下图。我已经更新了我的网站和代码，现在看起来像这样：ghostparis.com[现在看起来像这样：ghostparis.com]。好的，到目前为止，图像正在加载并在旋转木马中，不会自动播放，也不会垂直而不是水平加载，就像如果您使用移动设备访问网站，您将看到图像向下加载，而不会像下一幅图像那样横向加载。我不知道如何修理它

我尝试过用代码（HTML）创建它

背景色红色仅用于开发目的，因为它刚刚被滑块上的图像覆盖

我认为javascript是我的错误所在，因为这是我第一次真正创建滑块：

var slider1 = function(){

  $('.slider_active').owlCarousel({
    loop:true,
    margin:0,
  items:1,
  autoplay:true,
  navText:['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'],
    nav:true,
  dots:true,
  autoplayHoverPause: true,
  autoplaySpeed: 800,
    responsive:{
        0:{
            items:1,
            dots:false,
        },
        767:{
            items:1,
            dots:false,
        },
        992:{
            items:1,
            dots:true,
        }
    }
  })


};
slider1();

var slider1=函数（）{
$（'.slider_active'）.owlCarousel({
循环：对，
保证金：0，
项目：1，
自动播放：对，
导航文本：[''，''，
导航：是的，
点：是的，
自动播放暂停：对，
自动播放速度：800，
响应：{
0:{
项目：1，
点：错，
},
767:{
项目：1，
点：错，
},
992:{
项目：1，
点：是的，
}
}
})
};
滑块1（）；

---

非常感谢您的帮助。

好的，现在看起来没那么糟糕，但图像是向下嵌套的，而不是横向嵌套的。好的，现在看起来没那么糟糕，但图像是向下嵌套的，而不是横向嵌套的

    .backgroundHome{

  width: 100%;
  height: 100%;
}
.item img{
    display: block;
    width: 100%;
    height: auto;
}

var slider1 = function(){

  $('.slider_active').owlCarousel({
    loop:true,
    margin:0,
  items:1,
  autoplay:true,
  navText:['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'],
    nav:true,
  dots:true,
  autoplayHoverPause: true,
  autoplaySpeed: 800,
    responsive:{
        0:{
            items:1,
            dots:false,
        },
        767:{
            items:1,
            dots:false,
        },
        992:{
            items:1,
            dots:true,
        }
    }
  })


};
slider1();