winerfresh napisał(a)
RFabianski napisał(a)
Dlaczego tego rozwiązania nie powinno się stosować przy obecnym projektowaniu stron?
Bo nowoczesne przeglądarki same o to dbają.
Ale mrowie użytkowników nie ma nowoczesnych przeglądarek...
Ten LazyLoad nie działa na mojej stronie (nie wiem czemu, ale mam już dość próbowania). Chcę spróbować napisać sam taką funkcję, ale nie wiem jak wywołać odpowiednie zdarzenie, kiedy obrazek (a właściwie miejsce na niego) będzie na ekranie. Jakieś pomysły?
EDIT: ok, mam taki kod, ale nie działa do końca jakbym chciał (nie wiem czemu):
$(window).scroll(function(){
$('#lazy_gallery img').each(function(){ //dla kazdego obrazka w divie #lazy_gallery
if($(this+'[original]')) //jezeli element jeszcze ma atrybut "original"
{
if($(this).position().top<=($(window).height())) //jezeli element jest widoczny
{
$(this).hide(); //ukryj go
$(this).attr('src',$(this).attr('original')); //nadal mu wlasciwe zrodlo
$(this).removeAttr('original'); //usun atrybut "ariginal"
$(this).fadeIn(500); //pokaz element
}
}
});
});
W HTML mam po prostu:
<div id="lazy_gallery">
<img src="images/blank.png" original="images/1.gif"><br>
<img src="images/blank.png" original="images/2.gif"><br>
<img src="images/blank.png" original="images/3.gif"><br>
<img src="images/blank.png" original="images/4.gif"><br>
...
</div>