解决layer图标icon不加载的问题


Posted in Javascript onSeptember 04, 2019

之前在项目中使用layer弹框感觉体验很好,这次的项目中就引入了,但是引入之后,弹出层如下图:

代码:

layer.msg("密码不正确!", {icon:5,time:1000});

解决layer图标icon不加载的问题

并没有显示出图标!

F12查看才发现如下报错:

http://127.0.0.1:8020/xxx/js/theme/default/layer.css?v=3.1.1 net::ERR_ABORTED layer.js

于是找到 layer.js,搜索 layer.css ,会搜索到两处地方,修改第二处,代码如下:

....n=(a?"modules/layer/":"theme/")+"default/layer.css?v="+r.v+i;return a....

修改为

....n=(a?"modules/layer/":"theme/")+"../../css/layer.css?v="+r.v+i;return a....

也就是让他的路径指向你layer.css存放的文件夹下。

但是刷新页面发现提示说找不到 icon.png 图片 ! 于是去layer官网下载layer,之后找到该图片,图片如下:

解决layer图标icon不加载的问题

把他拷贝到图片存放的路径下,之后打开layer.css ,搜索 icon.png ,并把该图片路径指向你的图片存放文件夹,代码如下:

.layui-layer-ico{background:url(../img/icon.png) no-repeat}

在此刷新页面发现ok了,如图所示:

解决layer图标icon不加载的问题

当然了,还有一个最简单的办法就是,到官网下载layer,把他全部拷贝到项目中,之后在页面只需要引入:

<script type="text/javascript" src="layer/layer.js" ></script>

如上代码就可以。

以上这篇解决layer图标icon不加载的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery中文入门指南,翻译加实例,jQuery的起点教程
Jan 13 Javascript
让firefox支持IE的一些方法的javascript扩展函数代码
Jan 02 Javascript
JS中的log对象获取以及debug的写法介绍
Mar 03 Javascript
javascript的数组和常用函数详解
May 09 Javascript
EasyUI中datagrid在ie下reload失败解决方案
Mar 09 Javascript
JavaScript中getUTCSeconds()方法的使用详解
Jun 11 Javascript
jquery控制页面部分刷新的方法
Jun 24 Javascript
javascript中字体浮动效果的简单实例演示
Nov 18 Javascript
AngularJS使用指令增强标准表单元素功能
Jul 01 Javascript
原生JS 实现的input输入时表格过滤操作示例
Aug 03 Javascript
JS实现分页导航效果
Feb 19 Javascript
js this 绑定机制深入详解
Apr 30 Javascript
JSX在render函数中的应用详解
Sep 04 #Javascript
关于layui的动态图标不显示的解决方法
Sep 04 #Javascript
vue本地打开build后生成的dist文件夹index.html问题
Sep 04 #Javascript
简单谈谈javascript高级特性
Sep 04 #Javascript
在layui中使用form表单监听ajax异步验证注册的实例
Sep 03 #Javascript
解决mui框架中switch开关通过js控制开或者关状态时小圆点不动的问题
Sep 03 #Javascript
mui js控制开关状态、修改switch开关的值方法
Sep 03 #Javascript
You might like
如何用phpmyadmin设置mysql数据库用户的权限
2012/01/09 PHP
Yii操作数据库的3种方法
2014/03/11 PHP
PHP的反射类ReflectionClass、ReflectionMethod使用实例
2014/08/05 PHP
深入浅析安装PhpStorm并激活的步骤详解
2020/09/17 PHP
javascript第一课
2007/02/27 Javascript
Add Formatted Data to a Spreadsheet
2007/06/12 Javascript
js正确获取元素样式详解
2009/08/07 Javascript
一个简单的js动画效果代码
2010/07/20 Javascript
JavaScript中的View-Model使用介绍
2011/08/11 Javascript
jquery的ajax简单结构示例代码
2014/02/17 Javascript
js生成随机数的过程解析
2015/11/24 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
Bootstrap php制作动态分页标签
2016/12/23 Javascript
微信小程序点击控件修改样式实例详解
2017/07/07 Javascript
ES6正则表达式扩展笔记
2017/07/25 Javascript
JS严格模式知识点总结
2018/02/27 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
浅谈Vue的响应式原理
2019/05/30 Javascript
react koa rematch 如何打造一套服务端渲染架子
2019/06/26 Javascript
2分钟实现一个Vue实时直播系统的示例代码
2020/06/05 Javascript
[01:00:53]2018DOTA2亚洲邀请赛3月29日 小组赛B组 iG VS Secret
2018/03/30 DOTA
[02:49]DAC2018决赛日TOP5 LGD开启黑暗之门绝杀VP
2018/04/08 DOTA
[16:01]夜魇凡尔赛茶话会 第二期01:你比划我猜
2021/03/11 DOTA
详细解析Python中的变量的数据类型
2015/05/13 Python
python调用tcpdump抓包过滤的方法
2018/07/18 Python
在python Numpy中求向量和矩阵的范数实例
2019/08/26 Python
利用python3筛选excel中特定的行(行值满足某个条件/行值属于某个集合)
2020/09/04 Python
canvas环形倒计时组件的示例代码
2018/06/14 HTML / CSS
EGO Shoes美国/加拿大:英国时髦鞋类品牌
2018/08/04 全球购物
德国高端单身人士交友网站:ElitePartner
2018/12/02 全球购物
应用心理学个人的求职信
2013/12/08 职场文书
幼儿园教师考核制度
2014/02/01 职场文书
先进教师事迹材料
2014/12/16 职场文书
新郎结婚保证书
2015/02/26 职场文书
运动会班级口号霸气押韵
2015/12/24 职场文书
个人工作总结(管理人员)范文
2019/08/13 职场文书