layer ui插件显示tips时,修改字体颜色的实现方法
今天做调查问卷,又遇到一个蛋疼小问题,记录下。
调查问卷有很多选项是要求必填的,如果不填的话,需要给出友好的提示。用的如下组件:http://layer.layui.com/
1、之前一直默认用的:
<script src="/assets/js/layer/layer.js"></script> function showMessage(msg, domObj) { layer.tips(msg, domObj,{tips:3});//弹出框加回调函数 } showMessage("选项不能为空", $(this));
效果如下:
2、ui过来看了下之后,说太丑,要换成白色背景,红色字体
可是查看了半天的官方文档,只看到了修改背景颜色的配置项,没找到改字体色的配置项:
勉强修改背景色后如下:
function showMessage(msg, domObj) { layer.tips(msg, domObj,{tips:[3,"red"]});//弹出框加回调函数 }
3、最后实在无语,说搞不了,后边同事折腾了一会,过来提供了如下方案:
function showMessage(msg, domObj) { layer.tips("<span style='color:red'>"+msg+"</span>", domObj,{tips:[3,'#fff']});//弹出框加回调函数 }
好吧,背景色还是可以改的。。。有时候说不行,只是没想到而已
以上这篇layer ui插件显示tips时,修改字体颜色的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
layui操作列按钮个数和文字颜色的判断实例
一.达到的效果如图,通过值去判断是否需要该按钮 cols: [[ //表头 {field: 'money', title: '操作',toolbar: '#barDemos'} ]] <script type="text/html" id="barDemos"> {{# if(d.s_state == 0){ }} <span style="color:red">未审核</span> {{# }else if(
-
layer ui插件显示tips时,修改字体颜色的实现方法
今天做调查问卷,又遇到一个蛋疼小问题,记录下. 调查问卷有很多选项是要求必填的,如果不填的话,需要给出友好的提示.用的如下组件:http://layer.layui.com/ 1.之前一直默认用的: <script src="/assets/js/layer/layer.js"></script> function showMessage(msg, domObj) { layer.tips(msg, domObj,{tips:3});//弹出框加回调函数 } s
-
layui: layer.open加载窗体时出现遮罩层的解决方法
如下所示: 把窗体方法独立出来放在layer.use([],function(){});外面,需要的时候从layer.use方法里面调用,就不会出现遮罩层 layer.use([],function(){ $("#添加按钮id").click(function(){ editData("",form,"添加") ; }) ; }); function editData(data,from,title){ var win = layer.open(
-
微信小程序实现点击按钮修改字体颜色功能【附demo源码下载】
本文实例讲述了微信小程序实现点击按钮修改字体颜色功能.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 index.wxml文件 <view class="view" style="color:{{color}}">我是view标签</view> <view style="display:flex;"> <block wx:for="{{colorArray}}" wx:k
-
jQuery实现字体颜色渐变效果的方法
本文实例讲述了jQuery实现字体颜色渐变效果的方法.分享给大家供大家参考,具体如下: jQuery不允许css属性值为非数字的属性进行动画处理, 比如.animate(color:'red',500)或是.animate(fontWeight:'bold',500)都无法运行, 因此如果想实现颜色渐变的效果需要animate()外的其他方法,示例如下 方法1: <!DOCTYPE html> <html lang="en"> <head> <
-
Android编程实现TextView字体颜色设置的方法小结
本文实例讲述了Android编程实现TextView字体颜色设置的方法.分享给大家供大家参考,具体如下: 对于setTextView(int a)这里的a是传进去颜色的值.例如,红色0xff0000是指0xff0000如何直接传入R.color.red是没有办法设置颜色的,只有通过文章中的第三种方法先拿到资源的颜色值再传进去. 复制代码 代码如下: tv.setTextColor(this.getResources().getColor(R.color.red)); 关键字: android t
-
CKeditor4 字体颜色功能配置方法教程
本文实例讲述了CKeditor4 字体颜色功能配置方法.分享给大家供大家参考,具体如下: 今天动手ckeditor编辑器的时候发现工具栏上并没有可以更改字体颜色和背景颜色的按钮,所以我上网搜了下,网上特别多config.js文件配置的代码了,看得眼花缭乱的我选择把全部代码都复制下来.结果当然是没用的--一开始我还能有文本框.工具栏,到后来就变成什么都没有了. 后来我找到了ckeditor的文档:https://ckeditor.com/docs/index.html,找到里面的指南 在搜索框里搜
-
Pycharm插件(Grep Console)自定义规则输出颜色日志的方法
很多介绍 根据日志等级打印不同颜色 的文章都是介绍的Ideolog, 但是我个人还是倾向于 Grep Console, 你可以在配置界面配置自己预定的正则规则, 根据规则匹配将输出附带颜色的日志内容: 你需要在 Pycharm -> Settings -> Plugins 进行安装并重启 Pycharm 设置自己的正则规则, 你可以通过 Pycharm -> settings -> other settings -> Grep console 进行规则配置, 或者是点击 RU
-
iOS开发技巧之状态栏字体颜色的设置方法
状态栏的字体为黑色:UIStatusBarStyleDefault 状态栏的字体为白色:UIStatusBarStyleLightContent 一.在info.plist中,将View controller-based status bar appearance设为NO 状态栏字体的颜色只由下面的属性设定,默认为白色: // default is UIStatusBarStyleDefault [UIApplication sharedApplication].statusBarStyle 解
-
Flutter 透明状态栏及字体颜色的设置方法
注:底色透明是否生效与android版本有关,版本过低设置无效 1.在main.dart内设置 void main(){ runApp(new MyApp()); if (Platform.isAndroid) { //设置Android头部的导航栏透明 SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle( statusBarColor: Colors.transparent, //全局设置透明 statusBarIc
-
extjs grid设置某列背景颜色和字体颜色的实现方法
css代码: 复制代码 代码如下: .x-grid-back-red { background: #FF0000; } js代码: 复制代码 代码如下: { header : '分成类型', dataIndex : 'divideType', renderer : function(v,m){ m.css='x-grid-back-red'; return v; }, width : 60 } 或者直接这样写也可以 复制代码 代码如下: { header : '编号', dataIndex :
随机推荐
- 关于mysql合并表的详细介绍
- [PHP]常用正则表达式收集
- iOS开发中Quartz2D绘图路径的使用以及条纹效果的实现
- Java多线程 线程同步与死锁
- 充分利用ASP.NET的三种缓存提高站点性能的注意方法
- Python中表示字符串的三种方法
- android 定位的4种方式介绍
- jQuery+AJAX实现网页无刷新上传
- 在Ruby on Rails中使用Markdown的方法
- Linux查看系统版本的方法汇总
- JavaScript实现图片本地预览功能【不用上传至服务器】
- jquery分析文本里url或邮件地址为真实链接的方法
- noty – jQuery通知插件全面解析
- jquery实现提示语淡入效果
- 写了几个类,希望对大家有用。
- 复制本贴标题和地址的js代码
- PHP实践教程之过滤、验证、转义与密码详解
- 使用递归算法求第30位数的值
- C#开发Android百度地图手机应用程序(多地图展示)
- Laravel 5.3 学习笔记之 配置