Html - CSS - XML - JavaScript - Ajax
Owl Carousel Item Yüklendiğinde Yüksekliğini Bulmak
Owl Carousel Item Yüklendiğinde Yüksekliğini Bulmak
-
$owl = $('#presentation-bar').owlCarousel({ loop:false, margin:3, rewind: false, dots: false, responsiveClass:true, responsive:{ 0:{ items:5 }, 600:{ items:5 }, 1000:{ items:5 } } }); //startIntervalPresentationCarousel(); setTimeout(function () { let image_offset = $('#presentation-bar .item img').get(0).height; viewportHeight = BROWSER.HEIGHT - VIEWEROFFSET - (image_offset + 16); $('#viewer').css("height", viewportHeight); viewer.viewport.goHome(); KTApp.unblockPage(); }, 2500);
Bir tane owl carousel çağırıyorum, bir butona basıldığında.
Bu owl carousel slider'ının resim boyutuna göre tam ekran olan viewer'ımın yüksekliğini küçültmem gerekiyor.
Direk,
let image_offset = $('#presentation-bar .item img').get(0).height;
Böyle aldığımda image_offset değeri 0 geliyor. Belli bir süre geçtikten sonra tarayıcıda yüksekliği görünüyor. Ben de timeout ile 2 buçuk saniye bekletip öyle alıyorum bu değeri. Böyle yapınca düzgün geliyor ama eğer çok çok çok fazla resim yüklersem owl carousel'e, bu sefer 2 buçuk saniye yeterli olmuyor.
"image_offset değeri 0'dan büyük olana kadar bekle" demek istiyorum. Nasıl yapabilirim?
-
https://owlcarousel2.github.io/OwlCarousel2/docs/api-events.html
initialized.owl.carousel metoduna koymayı denedim ama yine 0 geliyor orada da. Sanırım tarayıcı ile ilgili bir durum.
-
Up çekiyim Neverland hocama
-
owlcarouselin changed methodu ile denedin mi? anladığım kadarıyla viewport yüksekliğini aktif slide da ki görsel yüksekliği kadar yapmak istiyorsun doğru mudur?
-
Cosmic bunu yazdı
owlcarouselin changed methodu ile denedin mi? anladığım kadarıyla viewport yüksekliğini aktif slide da ki görsel yüksekliği kadar yapmak istiyorsun doğru mudur?
evet hocam, ben bu konuyu açtığımı unuttum. Kusura bakmayın. Şöyle çözdüm, belki birinin işine yarar.
Chrome hiç bir şekilde resimi yüklemiyor, o metotlar içinde. Hepsini denedim.
let interval_thumbs; let timeout_thumbs = setTimeout(function () { clearInterval(interval_thumbs) }, 10000); // destroy interval after 10 seconds to prevent memory leak interval_thumbs = setInterval(function () { let image_offset = $('#presentation-bar .item img').get(0).height; if (image_offset > 10) { viewportHeight = BROWSER.HEIGHT - VIEWEROFFSET - (image_offset + 16); $('#viewer').css("height", viewportHeight); KTApp.unblockPage(); $owl.trigger('to.owl.carousel', PRESENTATIONPAGE); clearInterval(interval_thumbs); clearTimeout(timeout_thumbs); // clear both timeout and interval } }, 100); // loop every 100 milliseconds to "poll" for the node in the dom