imagesLoaded 是一个用于来检测网页中的图片是否载入完成的 JavaScript 工具库。支持回调的获取图片加载的进度,还可以绑定自定义事件。可以结合 jQuery、RequireJS 使用。

插件下载     效果演示

使用示例:

// element
imagesLoaded( document.querySelector('#container'), function( instance ) {
console.log('all images are loaded');
});
// selector string
imagesLoaded( '#container', function() {...});
// multiple elements
var posts = document.querySelectorAll('.post');
imagesLoaded( posts, function() {...});

绑定自定义事件:

var imgLoad = imagesLoaded( elem );
function onAlways( instance ) {
console.log('all images are loaded');
}
// bind with .on()
imgLoad.on( 'always', onAlways );
// unbind with .off()
imgLoad.off( 'always', onAlways );
您可能感兴趣的相关文章

本文链接:imagesLoaded – 检测网页中的图片是否加载

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

imagesLoaded – 检测网页中的图片是否加载的更多相关文章

  1. 解决网页中Waiting (TTFB)数据加载过慢的问题

    解决网页中Waiting (TTFB)数据加载过慢的问题 最近做了一个网页,在本地测试良好,数据可以得到很快的反馈,但是当部署到云端Linux上时候,就会出现加载缓慢的问题.本地测试,得到数据大概3s ...

  2. Android新浪微博客户端(七)——ListView中的图片异步加载、缓存

    原文出自:方杰|http://fangjie.info/?p=193转载请注明出处 最终效果演示:http://fangjie.sinaapp.com/?page_id=54 该项目代码已经放到git ...

  3. 简单的ListView中item图片异步加载

    前言:     在android开发当中,从目标地址获取图片往往都是采用异步加载的方法.当完全加载完图片后在进行显示,也有些是直接将加载的图片一点一点的显示出来. 这两个区别只是对流的处理不同而已.现 ...

  4. vue项目中实现图片懒加载的方法

    对于图片过多的页面,为了加速页面加载速度,所以很多时候我们需要将页面内未出现在可视区域内的图片先不做加载, 等到滚动到可视区域后再去加载.这样子对于页面加载性能上会有很大的提升,也提高了用户体验. 实 ...

  5. Vue项目中实现图片懒加载

    个人网站 https://iiter.cn 程序员导航站 开业啦,欢迎各位观众姥爷赏脸参观,如有意见或建议希望能够不吝赐教! ---对于图片过多的页面,为了加速页面加载速度,所以很多时候我们需要将页面 ...

  6. js实现一个长页面中的图片懒加载即滚动到其位置才加载

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. Android 图片从网页中获取并动态加载到listview中

    实现功能: 效果图: 代码:这里

  8. Myeclipse java程序中运行图片无法加载并且乱码

       Windows---prefrence--workspace--text file encoding亲测有效

  9. 网页loading GIF图片(加载)

    http://www.lanrentuku.com/gif/a/loading.html

随机推荐

  1. LVS负载平衡集群(没成型)

    LVS:可以实现高可用的.可伸缩的Web.Mail.Cache和Media等网络服务,实现一个可高用.高性能.低成本的服务器应用软件 LVS集群组成: 前端:负载均衡层 --由一台或多台负载调度器构成 ...

  2. 做小图标还用sprite图?你out了!史上最简单易懂iconfont使用教程

    1.什么是iconfont? 说白了就是用图标制作而成的一套字体文件,本质是一个字体文件(扩展名是ttf\woff\svg的文件).它是用来制作网页常用小图标的一种方法.以下是天猫首页使用iconfo ...

  3. URL中的特殊字符

    原网址:http://pichcar.iteye.com/blog/676292 URL中的特殊字符 有些符号在URL中是不能直接传递的,如果要在URL中传递这些特殊符号,那么就要使用他们的编码了.编 ...

  4. androud 自定义属性

    在values文件夹下新建的attrs.xml文件如下: format是该属性的一种单位:有 color,String,references等. <?xml version="1.0& ...

  5. 【web前端面试题整理05】做几道前端面试题休息休息吧

    前言 连续学了两天javascript的东西了,我们都累了,于是今天还是上一套面试题吧,大家一起休息休息,也为下个星期可能会有的面试准备下. 题目一览 CSS1.  overflow-x  属于 CS ...

  6. MAC Objective-C 开发经典书籍推荐

    MAC Objective-C 开发经典书籍推荐 闻道有先后,术业有专攻,这句话放到计算机科学领域的理解可能每个人都会不同. 有些人选择一个操作系统,一个体系的编程语言,作一个领域的开发. 有些人选择 ...

  7. Maven提高篇系列之(二)——配置Plugin到某个Phase(以Selenium集成测试为例)

    这是一个Maven提高篇的系列,包含有以下文章: Maven提高篇系列之(一)——多模块 vs 继承 Maven提高篇系列之(二)——配置Plugin到某个Phase(以Selenium集成测试为例) ...

  8. 【读书笔记】--SQL基础概念复习

    主键:每个表,只能有一个主键,主键不能为NULL,且必须是唯一的.主键最好是由单个列组成,但这不是必须的,主键也可以是由多个列组成,如果表的两个列组合在一起能唯一标识一个行,而单个列不能,则可以将这两 ...

  9. .net请求Webservice简单实现天气预报功能

    很久没有接触Webservice的知识,今天稍微复习了一下关于webservice,简单做了一个天气预报的功能,虽然界面丑的厉害,但功能算是实现了,以下是效果展示. 这东西没什么难点,只是天气预报的功 ...

  10. 【C#】回调方法不通过object参数获得委托实例

    回调方法中几乎都会存在获取委托实例的需求,进而通过委托实例调用EndInvoke以得到异步执行的返回值.在我看过的相关文章中,获取委托实例的方法几乎都是同一个,就是向BeginInvoke的最后一个参 ...