当我在启用动态高度的图像幻灯片上启用Lazyload时,它会切断并仅显示照片高度的一小部分,我附上了截图,如果初始加载可以完美地查看图像,请使用切换箭头和你将能够看到我的意思。
我一直在尝试各种修复无效,因为这是我购买的html主题,不幸的是,主题作者也无法帮助我,你的帮助将不胜感激。
我在自定义脚本文件中的JS是:
$(".property-carousel").owlCarousel({
rtl: _rtl, items: 1, lazyLoad : true,
responsiveBaseWidth: ".property-slide", dots: false,
autoHeight: true, nav: true, navText: ["", ""], loop: true
});
尝试在功能上添加自动高度
owlCarousel({
items: 1,
loop: true,
autoHeight: true
});
设置自动高度为true
autoHeight: true
这是我对问题的解决方案:
gallery.owlCarousel({
margin:5,
loop:false,
autoHeight:true,
items:1,
nav: false,
dots: false,
lazyLoad:true
});
gallery.on('loaded.owl.lazy', function(event) {
$(this).find('.owl-item.active img').one('load', function () {
gallery.trigger('refresh.owl.carousel');
});
});
我也有这个问题,“lazyLoad”结合“autoHeight”切断了一些图像,因为猫头鹰旋转木马没有考虑到懒人图像的高度。对我来说,这是有效的(修改@baduga的答案):
var myCarousel = $(".property-carousel").owlCarousel({
lazyLoad : true,
autoHeight: true
});
myCarousel.on('loaded.owl.lazy', function(event) {
myCarousel.trigger('refresh.owl.carousel');
});