Добрый день!
На сайте добавлена карусель из 6 одновременно отображаемых элементов.
Карусель в верхней части страницы и отображается на первом экране при загрузке страницы.
Так как lazyload картинок срабатывает, только прокрутке страницы, то посетитель сайта часто видит просто пустую карусель.
Пытаюсь сделать чтобы картинки подгрузились без действий пользователя , сразу после загрузки страницы.
Почитал документацию , вроде можно делать предзагрузку lazyload, если добавить параметр lazyLoadEager: 5
я понимаю , что можно ссылку на картинку сразу передать в аттрибут src у тега img, но хочется все таки грузить картинки асинхронно основному потоку загрузки.
Получается так , но предзагрузка не происходит:
$("#news-carousel").owlCarousel({
lazyLoad:true,
lazyLoadEager: 6,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
loop: true,
navRewind: false,
responsiveClass: true,
dots: false,
responsive: {
0: {
items: 1,
nav: true,
autoHeight: true,
},
480: {
items: 2,
nav: true,
},
740: {
items: 4,
nav: true,
},
960: {
items: 5,
nav: true,
},
1200: {
items: 6,
nav: true,
}
},
transitionStyle: "fade",
navText: ["<div class='notyfer'></div><div class='glyphicon glyphicon-chevron-left'></div>", "<div class='notyfer'></div><div class='glyphicon glyphicon-chevron-right'></div>"]
});
Подскажите что делаю не так?