Toplam 320 konuya 1920 yorum yazıldı.
Lazy Load Nasıl Kullanılır

Selamlar arkadaşlar bu konumuzda lazy load kullanımından bahsedeceğim.Peki bunu neden kullanmamız gerekiyor.Çok fazla resim bulunan web sitelerimizde resimlerin çokluğundan dolayı sayfalarımız ister istemez geç yüklenmektedir.Bundan dolayı lazy load kullanmamız gerekebilir.Tabi size kalmış kullanmayada bilirsiniz.



Kullanımı öncelikle lazyload kütüphanemizi dahil ediyoruz.



https://raw.github.com/tuupola/jquery_lazyload/master/jquery.lazyload.js




<script src="/lazyload.js" type="text/javascript"></script>


Lazy load uygulamak istediğimiz resimlerimizi aşağıdaki formatta çağırıyoruz.





class: lazyload uygulamak istediğimiz resimlere “lazyload” classını da ekliyoruz.





src: buraya asıl resim yuklenmeden basılacak olan resmin yolunu veriyoruz.





data-original: burada ise asıl resmimizin yolunu veriyoruz.




<img class="resim lazyload " alt="Resim açıklaması" src="/images/blank.gif" data-original="/images/original-resim.jpg" />

Body tagımızı kapatmadan hemen önce jquery kütüphanemizdeki lazyload fonksiyonumuzu çağırıyoruz.



<script type="text/javascript" charset="utf-8">
$(function () {
$(".lazyload").lazyload();
});

</script>



Yorumlar

YAVUZ SELİM ŞAHİN

06.02.2018 07:38

@CIHAN ÖZEN işine yaradıysa ne mutlu bana :)

Cihan ÖZEN

06.02.2018 07:36

Hocam teşekkür ederim. Çok işime yarayacak :)

Yorum Yaz