Responsively Lazy延迟加载响应式图像的库
Responsively Lazy 是一个可以延迟加载响应式图像的库。能够处理响应式图像、SEO 友好（有效的 HTML）并支持 WebP 格式。
下载并安装
下载缩小后的 css 和 js 文件或通过 npm 和 bower 安装
npm install responsively-lazy
bower install responsively-lazy
该库没有任何依赖项，它只有 1.1kb。
用法
- 在 head 标签中包含 css 文件
<link rel="stylesheet" href="responsivelyLazy.min.css">
- 在 body 标签结束前包含 js 文件
<script async src="responsivelyLazy.min.js"></script>
- 为每张图片添加以下代码
<div class="responsively-lazy" style="padding-bottom:68.44%;"> <img alt="" src="images/2500.jpg" srcset="images/400.jpg 400w, images/400.webp 400w, images/600.jpg 600w, images/1000.jpg 1000w" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /> </div>
要自定义的内容是 padding-bottom 样式，以及 src 和 srcset 属性的值。如果不知道图像纵横比，可以跳过 div 标签并将 Responsively Lazy 类移动到 img 标签：
<img class="responsively-lazy" alt="" src="images/2500.jpg" srcset="images/400.jpg 400w, images/400.webp 400w, images/600.jpg 600w, images/1000.jpg 1000w" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" />
如果浏览器支持，可以以 WebP 格式列出图像版本。
浏览器支持
Responsively Lazy 适用于支持 srcset 属性的浏览器。不受支持的浏览器将在 src 属性中加载图像。
评论
Echo.jsJavaScript 图像延迟加载库
Echo是一个独立的JavaScript懒加载图像的工具，快速、体积小（不足1k）和使用HTML5的data-属性。Echo支持IE8+。示例代码：<body><imgsrc="im
Echo.jsJavaScript 图像延迟加载库
0
Respify响应式图像库
Respify是个简单的响应式图像库，可以从一系列 span子节点的data-media和data-src属性解析图像，使用媒体查询来选择图像。在线演示Respify可以在图像标签或任何其他标签上使用
Respify响应式图像库
0
Mojito-Image-Lazyload延迟图像加载
Mojito-Image-Lazyload是一个Mojito框架下延迟图像加载的开发包。
Mojito-Image-Lazyload延迟图像加载
0
BttrLazyLoadingjQuery 图像延迟加载插件
BttrLazyLoading是一款响应式图像延迟加载的jQuery插件，允许用户的web应用延迟图片的加载直到图像滚动。BttrLazyLoading提供四种不同的屏幕大小版本：手机(<768
BttrLazyLoadingjQuery 图像延迟加载插件
0