Javascript 猫头鹰转盘2：背景图像不'；你不能及时装货吗？

我使用2.0.0b4创建了一个猫头鹰旋转木马，以图像作为divs中的背景样式，如下所示：

<div class="owl-carousel">
  <div class="item" style='background-image: url("http://example.com/image_1.jpg");'></div>
  <div class="item" style='background-image: url("http://example.com/image_2.jpg");'></div>
  <div class="item" style='background-image: url("http://example.com/image_3.jpg");'></div>
  ...more...
</div>

<script>
    $(document).ready(function(){
      var owl = $(".owl-carousel")
      owl.owlCarousel({
        // loop: true,
        nav: true,
        items: 4,
        responsive:{
            0:{
                items: 2,
                slideBy: 2
            },
            480:{
                items:3,
                slideBy: 3
            },
            768:{
                items:4,
                slideBy: 4
            }
        }
      })
    })
</script>

更多
$（文档）.ready（函数（）{
var owl=$（“.owl carousel”）
猫头鹰旋转木马({
//循环：对，
导航：是的，
项目：4，
响应：{
0:{
项目：2，
幻灯片：2
},
480:{
项目：3，
幻灯片：3
},
768:{
项目：4，
幻灯片：4
}
}
})
})

工作得很好，OC2的所有响应特性都很好。唯一的问题是：每次滚动旋转木马时，图像都会进入舞台空白，之后只会一次绘制出它们的背景。因此，当它们加载时，您会看到这个丑陋的flash（我认为这与延迟加载是分开的）

当您向前滚动时，以及当您向后滚动到您已经看到的div时，都会发生这种情况；这就好像div只有在它们就位并且所有动画都已经发生之后才进行渲染

---

想法？

在css文件中添加以下内容：

.owl-item {
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ(0) scale(1.0, 1.0);
}

---

你不需要给内部的

div

s一个owl carousel项目类吗；仍然发生在

class='item'

上。你是说还有别的课程吗？（我更新了问题以反映这一点。）感谢您的关注！对于这个类似的问题，有一个评论可能会有所帮助：当然；变量主要是一种样式，因此我可以在其他点调用旋转木马上的函数。和分号在javascript中是可选的：）可选，但强烈建议使用。：）