Lazyload在動態高度打開時切斷圖像高度

當啓用啓用動態高度的圖像幻燈片上的Lazyload時，它會切斷並僅顯示照片高度的一小部分，如果初始化加載你可以完美地查看圖像，請使用切換箭頭，你將能夠看到我的意思。Lazyload在動態高度打開時切斷圖像高度

我一直在嘗試各種修補程序無濟於事，因爲這是我購買的一個html主題，不幸的是，主題作者也無法幫助我，您的幫助將不勝感激。

的JS我有我的自定義腳本文件是：

 $(".property-carousel").owlCarousel({ 
     rtl: _rtl, items: 1, lazyLoad : true, 
     responsiveBaseWidth: ".property-slide", dots: false, 
     autoHeight: true, nav: true, navText: ["", ""], loop: true 
     });

來源

2017-04-06 Daniel

嘗試在功能添加自動高度

owlCarousel({ 
     items: 1, 
     loop: true, 
     autoHeight: true 
    });

一套自動高度真實

autoHeight: true

來源

2017-04-06 08:53:19

Alfin嗨，我已經將它設置爲true，這裏是一個副本，我有以下的custom.js，我失去的東西之內？ $（「屬性 - 旋轉木馬。」）owlCarousel（{ RTL：_rtl，項目：1， lazyLoad：真實， responsiveBaseWidth：「 .property滑」，點：假的， autoHeight：真實，導航：true， navText：[「」，「」]， loop：true }）; – Daniel

給第一個兩個圖像data-src-retina =「圖像路徑」 –

您需要OwlCarousel設置lazyload真：

lazyLoad: true

Go to the documentation for more。

來源

2017-04-06 09:08:32

嗨Nathaniel，它已經設置，延遲加載正在工作，但是我遇到的問題是圖像在啓用時切斷 – Daniel

沒有一個圖像在您的滑塊中具有相同的尺寸。一旦它們結束，OwlCarousel知道製作滑塊有多大，並且它始終如一。嘗試在每個貓頭鷹項目上設置一個最小高度，您可以調整它以響應媒體查詢。 –

我的確瞭解這個問題。你需要的是所有圖像的大小相同，然後用貓頭鷹旋轉木馬來了解這些圖像。有可能autoHeight不適用於lazyload，你有沒有試過把它關掉進行測試？ –

這裏是我的問題的解決方案：

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'); 
    }); 
});

來源

2017-10-18 00:19:19

Lazyload在動態高度打開時切斷圖像高度

回答

相關問題