貓頭鷹旋轉木馬2 - 內聯背景圖片不能正常工作

Question

我剛剛下載貓頭鷹旋轉木馬2創建一個內嵌背景圖像的旋轉木馬。我仔細閱讀提供的文檔：http://www.owlcarousel.owlgraphic.com/demos/lazyLoad.html

它說：

LazyLoad HTML strucutre需要類= 「貓頭鷹懶」 和 數據-SRC = 「url_to_img」 和/或數據-SRC-視網膜= 「url_to_highres_img」。如果 你設置了上面的設置，但不是在其他DOM元素上，那麼貓頭鷹 會將圖像加載到css內聯背景樣式中。

這裏是我的JS初始化：

$('.owl-carousel').owlCarousel({ 
    lazyLoad: true, 
    margin: 20, 
    loop: false, 
    nav: false, 
    items: 3, 
}); 

我的HTML代碼：

<div class="owl-lazy" data-src="images/carousel/default/default04.png" data-src-retina="images/carousel/default/default04.png" alt=""></div> 

但它不是加載一個注入的div圖像。我已經在谷歌搜索它，但都在靜脈。它現在不工作，可能是更新失敗或什麼。或者可能是我錯過了什麼？

Answer 1

作爲一種變通方法，你可以在<img>標記和下列方式加載它：

.carousel-image { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    z-index: 1; 
} 

確保你的貓頭鷹項容器具有position: relative;和內容有一個z-index大於1