【交流分享】图片本地缓存案例,控制downloader数量,避免手机发烫

之前有写过<<h5+的Downloader下载网络图片缓存到本地的案例>> http://ask.dcloud.net.cn/article/256
但后来才发现图片比较多时,downloader创建过多,手机立马发烫;
后来解决了也没有更新;
今天项目刚发出去,稳定下来;现在重新整理了一个案例分享给大家;

主要优化和解决的问题:
1.图片显示,先检查本地是否存在,如果存在则使用本地;如果不存在则联网下载,保存在本地
2.使用背景控制图片样式;比src灵活;
3.不同的场景,使用不同的图片下载默认图;(我项目中头像和产品的下载默认图是不一样的)
4.单个downloader下载,避免网速快或图片多创建过多downloader,导致手机发烫的问题
5.避免任务队列中,图片已存在,downloader下载卡顿的问题

6. 加入下载完成的渐变动画,
7. 其他,,自己发现..

使用方法很简单:两步!!!
1.导入imgload.css imgload.js md5.min.js 还有一张透明图translate.png
2.联网获取数据后,拼接的img格式为:<img sr c='默认图片' data-sr c='网络地址' onload='load(this)'/>

好了,具体看附件的案例