關(guān)于layui flow loading占位圖的實現(xiàn)方法
更新時間：2019年09月21日 09:33:35 作者：```...簡單點
今天小編就為大家分享一篇關(guān)于layui flow loading占位圖的實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
如果流圖片要加載失敗, 就會顯示找不到圖片的裂痕
代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" 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標(biāo)簽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")
修改完成后效果：
注意： 
以上這篇關(guān)于layui flow loading占位圖的實現(xiàn)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
今天小編就為大家分享一篇Layui給switch添加響應(yīng)事件的例子，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
基于JavaScript實現(xiàn)一個簡單的事件觸發(fā)器
這篇文章主要為大家詳細介紹了如何使用JavaScript實現(xiàn)一個簡單的事件觸發(fā)器,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-01-01
再談IE中Flash控件的自動激活 ObjectWrap...2007-03-03
本篇文章給大家分享了用嘴簡單的JS代碼來實現(xiàn)經(jīng)典貪吃蛇游戲的全部內(nèi)容，有興趣的朋友參考學(xué)習(xí)下。2018-01-01
JavaScript面試中常考的字符串操作方法大全(包含ES6)
對于JavaScript字符串操作方法，你真的全部掌握了嗎？來看看這篇面試中常考的字符串操作大全，包含最新的ES6字符串操作方法，值得收藏哦2020-05-05
首先改變被拖動元素的布局屬性，接著捕捉鼠標(biāo)事件，當(dāng)觸發(fā)mousedown時，記錄下當(dāng)前鼠標(biāo)在元素中的相對位置，接著處理mousemove事件2014-09-09
JavaScript實現(xiàn)表單注冊、表單驗證、運算符功能
在本篇文章里我們給大家整理了關(guān)于JavaScript中表單注冊、表單驗證、運算符的代碼示例，有興趣的朋友們可以測試學(xué)習(xí)下。2018-10-10
本文主要介紹了canvas實現(xiàn)時鐘效果的代碼。具有很好的參考價值，下面跟著小編一起來看下吧2017-02-02
微信h5靜默和非靜默授權(quán)獲取用戶openId的方法和步驟
這篇文章主要介紹了微信h5靜默和非靜默授權(quán)獲取用戶openId的方法和步驟，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06
對layui數(shù)據(jù)表格動態(tài)cols(字段)動態(tài)變化詳解
今天小編就為大家分享一篇對layui數(shù)據(jù)表格動態(tài)cols(字段)動態(tài)變化詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10