zoukankan      html  css  js  c++  java
  • layer插件

    最近在做公司的官网,其中有用到layer这款插件,以前没有接触过,不过学下来觉得好用好学。下面分享一下我的学习心得。

      layer是web弹出层组件。在官网下载好layer后,把他部署到你的项目文件中(不能去挪动layer里面的文件结构,因为它们是不可拆散的组合)。你不用去管其他文件是干嘛的,只需关心layer.js,当然layer是基于jQuery的,你需要在引入layer之前引入jquery1.8或者以上版本。

    一.基础参数:

    1.type——基础类型层(number类型值,默认0)

    0:信息框  1:页面层  2:iframe层  3:加载层  4:tips层

    2.title——弹出层标题

    title:"标题内容"  title:['标题内容','font-size:18px;']  title:false(不显示标题)

    3.content——弹出框内容

    content:'内容’  content:"<div>hello world</div>'

    4.area——弹出框的宽高

    area:'500px'只设置宽  area:['500px','300px']设置宽高

    5.icon——弹出层图标(只适用于信息框和加载层)

    信息框的取值范围:0~6  加载层的取值范围:0~2

    6.btn——弹出层按钮设置(默认:确认)

    btn:'yes'  btn:['yes'.'no']

    7.closeBtn——弹出层关闭按钮(默认:1)

    closeBtn:0不显示  closeBtn:2

    8.shade——除了弹出层其他部分(默认:0.3)

    shade:[0.8,'#393D49']换色  shade:0不显示

    9.shadeClose——点击除了弹出层其他部分的效果(默认:false)

    控制弹出层的关闭(当点击除了弹出层其他部分)

    shadeClose:true点击关闭  shadeClose:false点击不关闭

    10.time——弹出层自动关闭所需时间(毫秒为单位)

    二.常用方法

    1.layer.open(options)最核心的方法

    options:基础参数

    layer.open({content: '内容'})

    2.layer.alert(content,options,yes)信息框

    参数:

    content: 内容,

    option: 基础参数

    yes 点击确定按钮回调函数

    layer.alert('内容',{icon:1},function(index,layerDom){});

    3.layer.confirm(content,option,yes,cancel)询问层

    参数:

    cancel:取消按钮回调函数

    4.layer.msg(content,options,end)提示框

    参数:

    end:层销毁后触发回调

    5.layer.load(icon,option)加载层

    6.layer.tips(content,follow,options)tip层

    7.layer.title(title,index)改变层的标题

    8.layer.tab(options)tab层

  • 相关阅读:
    ajax请求或者页面需要缓存,代码如下
    jquery cookie 删除不了的处理办法
    大家来找茬-SpringMVC中Tomcat正常启动,始终访问不了Controller,出404错
    简单的批量读取外部insert文并插入DB
    关于Jquery.validate.js中动态删除验证remove方法的Bug
    Struts2.3.16.3 基本9个jar包
    CAS SSL证书错误处理
    cas 4.X单点登录实战
    如何高效利用时间
    ubuntu16.04 Detectron目标检测库配置(包含GPU驱动,Cuda,Caffee2等配置梳理)
  • 原文地址:https://www.cnblogs.com/it-body/p/6592092.html
Copyright © 2011-2022 走看看