如果流图片要加载失败, 就会显示找不到图片的裂痕

代码如下:

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" href="layui/css/layui.css" media="all">

</head>

<body>

<img lay-src="loadingImg/aaa.jpg">

<img src="loadingImg/bbb.jpg" alt="该图片不会加载">

<!--ddd.jpg 图片不存在-->

<img src="loadingImg/ddd.jpg">

<img src="loadingImg/loading.gif" lay-src="ddd.jpg">

<img src="loadingImg/loading.gif" lay-src="loadingImg/aaa.jpg">

<script src="layui/layui.js"></script>

<script type="text/javascript">

    var $;

    layui.use(['flow', 'jquery'], function () {

        var flow = layui.flow;

        $ = layui.jquery;

        flow.lazyimg();

    });

</script>

</body>

</html>

图片目录:

修改方法 :

img标签src为loading占位图的地址，lay-src为正图地址，图片懒加载时会替换src
<img src="loadingImg/loading.gif" lay-src="ddd.jpg">
修改js
lay/modules/flow.js 检索 &&!e.attr("src")
有三种修改方法
1.删除&&!e.attr("src")
2.改为&&e.attr("lay-src")
3.改为&&!e.attr("lay-src")

修改完成后效果:

注意:  

layui flow loading占位图实现方法的更多相关文章

  1. layui图片懒加载-loading占位图

    前言 使用layui的图片懒加载,发现未加载的图片没有loading占位图,显示的是裂图,看着不是很好.找了一些解决方法我统一记录一下. layui图片懒加载使用方法 layui.use(’flow’ ...

  2. iOS开发造轮子 | 通用占位图

    https://www.jianshu.com/p/beca3ac24031 实际运用场景: 没网时的提示view,tableView或collectionView没内容时的展示view,以及其它特殊 ...

  3. [RN] React Native Image 实现placeholder占位图

    React Native Image 实现placeholder占位图 react-native Image没有placeholder这样的props,但是业务有需要这种场景, 解决方法为: 使用Im ...

  4. Skeleton Screen加载占位图(内容出现前显示灰色占位图)的分析与实现

    今天有几个好友问了这个叫加载占位图的实现方法,我还在此问题下做了个回答.由于国内对这个的名词是各有各的叫法,所以这里直接用加载占位图来解释.相信很多人都看到过图中这样的加载方式: 这个图是一个国内知名 ...

  5. 零行代码为App添加异常加载占位图

    前文提要 近期准备重构项目,需要重写一些通用模块,正巧需要设置App异常加载占位图的问题,心血来潮设想是否可以零行代码解决此问题,特在此分享实现思路. 思路分享 对于App占位图,通常需要考虑的控件有 ...

  6. iOS开发——无网占位图的实现

    https://www.jianshu.com/p/d537393fe247 https://github.com/wyzxc/CQPlaceholderViewhttps://github.com/ ...

  7. [iOS]一行代码集成空白页面占位图(基于runtime+MJRefresh思想)

    2018年01月03日阅读 2472   [iOS]一行代码集成空白页面占位图(基于runtime+MJRefresh思想) LYEmptyView 此框架是本人在5,6个月前,公司启动新项目的时候, ...

  8. 零行代码为 App 添加异常加载占位图

    前文提要 近期准备重构项目,需要重写一些通用模块,正巧需要设置App异常加载占位图的问题,心血来潮设想是否可以零行代码解决此问题,特在此分享实现思路. 思路分享 对于App占位图,通常需要考虑的控件有 ...

  9. [问题解决]Fresco设置占位图不显示的问题

    [问题解决]Fresco设置占位图不显示的问题 /** * Created by diql on 2017/02/15. */ 问题说明 本来设置占位图是通过以下方法: public void set ...

随机推荐

  1. Android：异步处理之Handler+Thread的应用

    担心原文消失,做此记录,感谢 https://www.cnblogs.com/net168/p/4075126.html 前言 很久很久以前就听说了,每一个android的应用程序都会分别运行在一个独 ...

  2. 线性排序总结（c++实现）

    前面介绍了一些常用的比较排序算法,它们都是通过比较两个元素的大小进行排序,归并排序和堆排序在最坏情况下的复杂度为O(nlgn),可以证明(使用决策树模型),通过比较进行排序,算法的下界为O(nlgn) ...

  3. JSR303后端校验（一）

    JSR303后端校验(一) (1)在pom文件中添加依赖 <!-- JSR303后端校验 --> <dependency> <groupId>org.hiberna ...

  4. git更换仓库，保留分支，保留提交记录及开发权限

    别人推荐的方法都很复杂,这个步骤自己亲自尝试过,非常简单好用. 1.从原地址克隆一份裸版本库,比如原本托管于 GitHub. git clone --bare https://github....(原 ...

  5. oc语言源代码

    ? https://opensource.apple.com/source/objc4/objc4-493.9/runtime/

  6. 命令式&函数式：把大象关进冰箱里问题

    面向过程:把大象关进冰箱里: 把冰箱门打开=> 大象放冰箱里=> 冰箱门关上 面向对象: 冰箱.开门() 冰箱.放入(大象) 冰箱.关门() 函数式: 关进(冰箱,大象): 关门(放入(开 ...

  7. accept返回的socket的端口号和连接socket一样的！！！ socket绑定信息结构

    今天与同学争执一个话题:由于socket的accept函数在有客户端连接的时候产生了新的socket用于服务该客户端,那么,这个新的socket到底有没有占用一个新的端口? 讨论完后,才发现,自己虽然 ...

  8. springcloud(三)

    雪崩效应 一.为什么需要 Hystrix? 在微服务架构中,我们将业务拆分成一个个的服务,服务与服务之间可以相互调用(RPC).为了保证其高可用,单个服务又必须集群部署.由于网络原因或者自身的原因,服 ...

  9. nginx部署项目

    nginx介绍 Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器,在BSD-like 协议下发行.其特点是占有内存少,并发能力强,事实上nginx的并发 ...

  10. GitBook github

    创建一个新的仓库 创建一个新文件,名为SUMMARY.md 创建一本书首先进入gitbook的官网:https://www.gitbook.com/ 创建账户https://github.com/ 在 ...