美文网首页
简单的图片懒加载方案

简单的图片懒加载方案

作者: 无言_4f45 | 来源:发表于2018-07-20 10:56 被阅读0次

    echo.js图片懒加载方案

    一款超级轻量级的图片懒加载工具库,代码不多,完全可以集成到项目中。

    所需引入的文件

    1.echo.js
    2.一个loading.gif、blank.gif
    3.在img 的src写上图片很小loading.gif或blank.gif,然后在data-echo上绑定图片的真实地址。

    <img :data-echo="info.img" src="images/blank.gif">
    

    4.在js中初始化:

    Echo.init({
        offset: 0,//图片离可视区的距离多少时开始加载真实地址
        throttle: 250//图片延时加载
    });
    

    注意:使用vue模板时,需要在$nextTick中初始化

    相关文章

      网友评论

          本文标题:简单的图片懒加载方案

          本文链接:https://www.haomeiwen.com/subject/fryfmftx.html