惯例,首先贴上imagesLoaded的官方网址:http://imagesloaded.desandro.com/
第一次知道imagesLoaded这个插件是在做瀑布流布局时,当时选用的是masonry这个老牌瀑布流插件,imagesLoaded这个插件也是masonry官方推荐的,可能是同一伙人吧。具体场景是这样的,我们的图片宽度都是固定的,但高度不固定(瀑布流都是这样的吧),但masonry在进行排列前就必须确定图片的高度,而图片在尚未加载完成前是无法得知高度的(其实也不是绝对,我那时后期就改成在上传图片的时候就记录好图片的高度)。为了保证masonry在拿到图片高度,也即图片加载完成后再进行排列,我根据masonry的推荐,选用了这一款imagesLoaded插件。
imagesLoaded可以搭配jquery使用,也可以用原生js来调用,这里方便起见(也比较直观)就直接上jquery版的:
$('#container').imagesLoaded()
.always( function( instance ) {
//always事件,在所有图片都加载完成ÿ