layui使用tips_layui的tips层怎么用

layui的tips层的使用方法：首先引入文件layer.css和layer.js文件；然后使用代码格式为“layer.tips(msg, '#id',{tips: 1}，time:10000)”；最后设置相关参数即可。

本教程操作环境：Windows7系统、layui2.4版，该方法适用于所有品牌电脑。

layui中tips的使用

1、引入文件 layer.css 、 layer.js

2、参数介绍：layer.tips(content, follow, options) - tips层

{

content:tooltip内容可以是str，也可以是html代码

follow:依附的元素，一般用id表示

如果依附的元素是自己直接用this即可，如果是在其他元素的事件(比如点击)里面，记得更改this指向。

options:tips的配置型[tips位置：1上；2右；3下；4左,字体的颜色]

}

这3个是必填参数，也同时具有layer的其他基础参数，比如time(是否定时关闭)，area(设置框的宽高)，shadeClose(是否点击遮罩层关闭)等。

3、代码示例：layer.tips(msg, '#id',{tips: 1}，time:10000)

如果我们不想定时关闭，而是划过显示，划出隐藏的效果，可以配合mouseenter、mouseleave事件即可，此时的time值为0，比如

你喜欢的人：

$(function(){

var tips;

$('i.tooltip-icon').on({

mouseenter:function(){

var that = this;

tips =layer.tips("说明：只能选择阿毛我，哈哈哈",that,{tips:[2,'#fff'],time:0,area: 'auto',maxWidth:500});

mouseleave:function(){

layer.close(tips);

}

});

})

/* $(".ack-img").hover(function () {

layer.tips("智能组卷：每个用户考试时抽到的试题及顺序随机组成", '.ack-img', {tips: 1});

});*/

$(function(){

var tips;

$('.ack-img').on({

mouseenter:function(){

var that = this;

tips =layer.tips("智能组卷：每个用户考试时抽到的试题及顺序随机组成",

that,{tips:[2,'#fff'],time:0,area: 'auto',maxWidth:500});

//tips = layer.tips("智能组卷：每个用户考试时抽到的试题及顺序随机组成", that, {tips: 1});

mouseleave:function(){

layer.close(tips);

}

});

layui使用tips_layui的tips层怎么用相关推荐

layui使用tips_layui的tips层怎么用？
layui的tips层怎么用?下面本篇文章给大家介绍一下layui中tips的使用.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. layui中tips的使用 1.引入文件 laye ...
layui点击弹出层中按钮，关闭弹出层
layui点击弹出层中按钮,关闭弹出层原理:点击自己定义的button时,触发弹出层右上角取消按钮. <button type="button" lay-submit=&q ...
layui使用tips_layer 的提示层 tips的一般使用
1.提示层在鼠标经过的情况下出现,鼠标移开消失,且需提示的文案是固定写死的,不需要动态改变的 html: js: var layer_tips = 0; $(document).on('mouseen ...
layui如何隐藏弹出层关闭的按钮
layui默认弹出层是带有关闭按钮的,但是在某些场景我们不需要layui的关闭按钮,这时只需添加closeBtn :0即可效果图如下: 示例代码如下: layui.use('layer', func ...
layui中实现弹出层的确定与取消操作
实现弹出层的确定与取消操作的两种方式一.利用content中用元素生成的确定与取消按钮 <div id="wrapper"><button type=" ...
layui两个html传值,Layui(二级页面) 弹出层打开页面|传递参数
一级弹出层:弹出打开页面 layer.open({ type: 2, title: '添加用户', content: '../user/goAdd', area: ['460px', '450px'] ...
layui的确认弹出层的玩法
项目中用的windows的confirm确认框感觉很low 改了一下遇到两个问题使用layui前: function outExcel(url) {if (confirm("导出前请确 ...
layui正在加载遮罩层
1.场景项目开发过程中,可能会遇到,后台响应很慢的情况,这是,前端就需要给出友好的提示,以便让用户有更好的体验. 拿我个人项目中的一个事例说一下,删除站点的时候,需要删除站点的数据明细,数据明细有1 ...
layui不能关闭弹出层
var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); 失效解决方法: 将自己定义的var n ...
layer之弹层组件文档 layui.layer（v.1.9.0之后）
弹层组件文档 - layui.layer layer 至今仍作为 layui 的代表作,她的受众广泛并非偶然,而是这数年来的坚持.不弃的执念,将那些不屑的眼光转化为应得的尊重,不断完善和维护.不断建设 ...

layui使用tips_layui的tips层怎么用

layui使用tips_layui的tips层怎么用相关推荐

最新文章

热门文章