Сова Карусель 2 - Встроенные фоновые изображения не работают

Question

Я только что скачал Сову Карусель 2, чтобы создать карусель со встроенными фоновыми изображениями. Я внимательно прочитать документацию, доступную по адресу: http://www.owlcarousel.owlgraphic.com/demos/lazyLoad.html

Он говорит:

LazyLoad HTML strucutre требует класс = "Сова-ленивым" и данных SRC = "url_to_img" и/или данных-Src-сетчатку = "url_to_highres_img". Если вы установили выше настроек не на, а на другом элементе DOM, тогда Owl загрузит изображение в встроенный стиль фона 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. Я искал его на google, но все в вены. Теперь он не работает, может быть ошибка обновления или что-то еще. Или, может быть, я что-то упускаю?

Answer 1

В качестве обходного пути, вы можете загрузить его в <img> тег со следующими стилями:

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

Убедитесь, что филин элемент контейнера имеет position: relative; и содержание имеет z-index больше 1.