Lazy Load(1.7.0)中文文档 -- 延迟加载图片的jQuery插件(4)

    $("img:below-the-fold").lazyload({ 
        event : "sporty" 
    }); 
}); 
 
$(window).bind("load", function() {  
    var timeout = setTimeout(function() {$("img.lazy").trigger("sporty")},5000); 
});  
$(function() {         
    $("img:below-the-fold").lazyload({
        event : "sporty"
    });
});

$(window).bind("load", function() {
    var timeout = setTimeout(function() {$("img.lazy").trigger("sporty")},5000);
}); 
主要原理是,当 event 被设置为 scroll 以外的事件时, 实际上都会绑定了一个内置的 "appear" 事件.

顾名思义, 这个事件就是用来显示图片的. (其实 scroll 也是调用这个事件)

 

 

 

加载不可见的图片

 

 

Lazy Load 插件默认对隐藏的图片不加载(例如 display:none ). 这样做有助于性能的优化.

如果希望连隐藏的图片一起加载,则可以把 skip_invisible 设为 false .

 

[javascript]
$("img.lazy").lazyload({  
    skip_invisible : false 
}); 
$("img.lazy").lazyload({
    skip_invisible : false
});

 

Plugin has been tested with Safari 5.1, Firefox 3.6, Firefox 7.0, Firefox 8.0 on OSX and Firefox 3.0, Chrome 14 and IE 8 on Windows and Safari 5.1 on iOS 5 both iPhone and iPad.

 

 

其实1.7.0版还有一些新的特性.有空再补上.

 摘自 简生的代码备忘录