本文是自己整理的关于layer插件的提示层的结果

一、准备工作

  下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用)

  百度云资源链接:

  jQuery插件:链接:https://pan.baidu.com/s/1P8wGff6UfVn5JaplH4uysw 密码:rms3

  layer插件:链接:https://pan.baidu.com/s/1EuTF0DBY_azdQhcRCl0yBA 密码:xvjh

二、提示层测试

  (1)官方案例:

  默认关闭时间是3秒,效果如上(背景是官网的广告,实际效果是黑色半透明),代码如下:

$(function(){
layer.msg('玩命提示中');
})

  (2)自定义样式以及时间,效果如下:

  代码如下:

$(function(){
layer.msg('操作成功!',
{
icon: 6, //icon样式
time: 2000, //关闭时间为2s
       offset: ['90px', '900px']//自定义位置
}
);
})

 

三、其他细节知识

  1、自定义位置 offset: ['90px', '900px']

  类型:String/Array,默认:'auto'
  默认垂直水平居中。当你只想定义top时,你可以offset: '100px'。当您top、left都要定义时,你可以offset: ['100px', '200px']。除此之外,你还可以定义offset: 'rb',表示右下角。其它的特殊坐标,你可以自己计算赋值。

layer插件学习——提示层的更多相关文章

  1. layer插件学习——弹框(自定义页)

    本文是自己整理的关于layer插件的弹框样式结果 介绍: 官方介绍:layer至今仍作为layui的代表作,受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自 ...

  2. layer插件学习——询问框

    本文是自己整理的关于layer插件的询问框样式结果 一.准备工作 下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用) 百度云资源链接: jQuery ...

  3. layer插件学习——icon样式

    本文是自己整理的关于layer插件的icon样式结果 一.准备工作 下载jQuery插件和layer插件,并引入插件(注意:jQuery插件必须在layer插件之前引用) 百度云资源链接: jQuer ...

  4. jQuery弹出层layer插件的使用

    引入插件layer 触发弹出层的按钮/链接 <a href="javascript:showPop();"> <img src="" /> ...

  5. layer/layui弹出层插件bug

    <button class="layui-btn" lay-submit lay-filter="formDemo" id="layui-btn ...

  6. keras模块学习之层(layer)的使用-笔记

    本笔记由博客园-圆柱模板 博主整理笔记发布,转载需注明,谢谢合作! keras的层主要包括: 常用层(Core).卷积层(Convolutional).池化层(Pooling).局部连接层.递归层(R ...

  7. layer插件

    最近在做公司的官网,其中有用到layer这款插件,以前没有接触过,不过学下来觉得好用好学.下面分享一下我的学习心得. layer是web弹出层组件.在官网下载好layer后,把他部署到你的项目文件中( ...

  8. layer插件layer.photos()动态插入的图片无法正常显示

    layer插件layer.photos()动态插入的图片无法正常显示,点击后面插入的图片,显示的是之前的图片列表,再次点击又是正常 有朋友遇到同样的问题 http://fly.layui.com/ji ...

  9. uexQQ插件学习心得

    uexQQ插件学习心得 uexQQ插件的作用:通过qq可以分享图文,音乐,应用到相应的qq空间.支持手机客户端分享和手机webQQ分享.下面我们就来看一看他的一些方法. 我们先说一下分享的步骤,这个步 ...

随机推荐

  1. ubuntu-12.04.4-alternate-i386安装

    Ubuntu-12.04.4安装 0.网络配置环境: 1. 选择中文简体. 2.选择第一个,安装ubuntu . 3.询问是否安装所选择的语言版本,选择yes. 4.选择“否”默认键盘布局,选择 no ...

  2. hdu 5059 简单字符串处理

    http://acm.hdu.edu.cn/showproblem.php?pid=5059 确定输入的数是否在(a,b)内 简单字符串处理 #include <cstdio> #incl ...

  3. FastReport套打 和连续打印

    FastReport套打,纸张是连续的带锯齿的已经印刷好的,类似于通信公司发票这里设计的是客户销售记录.客户有两个要求:1.因为打印纸张是印刷的,明细记录只有8行,所以,如果明细记录如果不到8行,就将 ...

  4. 分形之树(Tree)

    似乎每一个有关分形的教程都要讲到分形树,大概是因为树是生活中最常见的分形实物吧.这一节将展示下如何一步一步地生长出一棵树来.其实现算法不难,就是在每一次生长迭代中,使线段生长出几条新的线段来. 核心代 ...

  5. !!! no internal routing support, rebuild with pcre support !!!

    sudo apt-get install libpcre3 libpcre3-dev sudo pip install uwsgi -I --no-cache-dir

  6. ASP .Net C# ---Excel导入导出方法

    导入导出的方法以及引用,可以自行创建一个帮助类 using System;using NPOI.SS.UserModel;using NPOI.XSSF.UserModel;using NPOI.HS ...

  7. 解决网页出现 net::ERR_ABORTED 404 (Not Found)问题

    1.在web.config配置文件中添加woff字体的MIME类型 在Web.config中的system.webServer节点添加 <staticContent> <remove ...

  8. webpack快速入门——实战技巧:watch的正确使用方法,webpack自动打包

    随着项目大了,后端与前端联调,我们不需要每一次都去打包,这样特别麻烦,我们希望的场景是,每次按保存键,webpack自动为我们打包,这个工具就是watch! 因为watch是webpack自带的插件, ...

  9. CSS3标签显示模式

    HTML标签一般分为块标签和行内标签两种类型,它们也称块元素和行内元素.具体如下: 块级元素(block-level) 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属性,常 ...

  10. nginx和tomcat访问图片和静态页面的配置方法

    生产环境下,有时候需要访问图片,正常需要应用ftp.nginx等配套使用,但是有时候为了简化,可以用以下的两种简单的访问,说实话,就是为了偷懒,但是效果是能有的,这就行了,所以今天做这个简化版的方便大 ...