layer发布 3.x 更新日志,业界最多人使用的Web弹层组件

精帖 未结贴
101 19933
官网 http://layer.layui.com/
# v3.0.3 2017.03.06

* 增加参数 isOutAnim,用于控制是否显示关闭动画,true 或者 false
* 撤销自动ready处理机制,因为在初始时与Ajax同步等使用场景存在耦合等问题
* 修复Firefox下对默认层设置了高度,按钮被溢出的bug
* photos层的出场动画不再是随机,而是采用默认动画(也可以通过参数 anim 来自定义)
* 去除photos层的默认关闭动画(觉得觉得不闪眼的话,也可以通过参数isOutAnim开启)
# v3.0.2 2017.02.25

* 新增 resizing 回调,用于监听窗口的调整大小
* 增加自动ready处理机制,即如果你页面一打开就执行弹层,无需放入layer.ready中
* 对moveEnd回调返回一个参数为当前容器的DOM对象
* 添加一个amd条件,避免 define出错(Merge pull request #42 from wangyateng/master)
* 修复tab,photos,prompt弹层默认success回调被覆盖导致功能不正常的问题(来自github用户 waychan23 的友情提醒)
* 完善多按钮场景换行的间距(之前是紧贴在一起,略不雅观)
* 弹出图片层的动画时间改为800ms
* 修复按方向键切换图片层过快时重复弹出的bug
* 修复与animate.css可能存在的动画冲突
在决定这个大版本更新之前,很多人建议我应该把时间放在刚刚发布的Layui上,因为layer已经比较成熟了,没必要再更新。但是,坚持layer是一种情怀,为了对得起“国内最多人使用的弹层组件”,我仍然义无反顾地追寻一个尽可能更完备的她。于是我把这种期许赋予在了layer 3.0上,我希望它会是一个更成熟的方案,在它所服务的领域,竭力做到极致。

# 【v3.0】 2016.11.07 - 该版本对2.x版本无缝兼容,可直接覆盖升级。
* 新增拖动弹层右下角可调节弹层尺寸的功能,由参数resize控制,默认开启。对loading、tips层无效
* offset参数新增 t、r、b、l、lt、lb、rt、rb、的赋值,可快捷实现上、右、下、左、左上角、左下角、右上角、右下角的边缘定位
* 新增btnAlign参数,支持三个参数:l/c/r,分别用于控制按钮居左、居中、居右的快捷设置(默认r,即居右)
* 点击最小化时,自动定位到页面左下角,在出现多个最小化时,会依次排列,这是一次较为重大的完善。
* 新增关闭层的过度动画(可通过anim: -1统一取消动画)

* 重写拖拽核心代码,性能大幅度提升
* layer.config核心调整
* layer.config中的extend参数只提供加载一个css皮肤文件(详见文档)
* 处理在head标签中执行layer弹层无效的情况
* 瘦身layer.ready方法
* 修改iframe层的loading动画
* 捕获页类型的弹层在关闭时,会根据所捕获元素的初始display值,进行不同处理,即不再强制隐藏。

* 剔除moveType参数,只提供默认的一种拖拽风格
* 剔除语义欠佳的fix参数,改为fixed取代
* 剔除语义欠佳的shift参数,改为anim取代,不过仍然对shift参数兼容

* 完善tips层细节
* 将prompt层改成页面层结构,即当你弹出prompt层时,再弹出msg,不会将prompt销毁。
* prompt层的textarea模式支持area参数来设定宽高
* layer.css大面积改善
* 降解IE6的fixed支持,不过仍然对ie6兼容(话说现在全浏览器兼容的组件已经不多了,layer后续会整理出不兼容ie6/7的版本)

* 修改图片超出屏幕后,重新计算大小的算法(Merge pull request from 390029659/master)
* 修复iframe层在用于iPhone设备时,无法触发滚动的Bug
往期更新:
layer 发布 2.4,兼容jQuery 3.0
空闲广告位,联系:xianxin@layui.com
  • oversleep oversleep
    2016-11-14 10:52:32
    tab选项卡能否增加鼠标划过就触发?
    0 回复
  • zuijin zuijin
    2016-11-14 12:01:39
    layer.open 希望可以加入一个可以跨iframe的回调函数

    是这样的,假如一个页面 A 有一个文本框是输入分类的,我用页面 B 来实现这个选择分类的功能,所以我在页面 A 加一个 layer.open 将 B 页面弹出来,选择分类后,反馈回页面 A,然后赋值给文本框。

    为了实现回馈回 A 页面这样的功能,现在只能
    1、在页面 A 的 end 回调函数用 layer.getChildFrame 来查找 B 页面的表单来获取值,
    2、在 B 页面使用 parent.xxxx 的方式来操作 A 页面的内容。

    但是如果 B 页面是一个公共的组件,那么这两种方式都是不够的,因为:
    1、方法1 会导致使用的每个组件都必须记住有什么表单,有多少个表单的问题,封装得不彻底,假如有100个组件,那么是不可能记住这些东西的。
    2、方法2 的问题是,页面 A 是千变万化的(任何一个调用了 B 的页面),导致 B 组件的代码不可能写成通用
    3、无论是 方法1 还是 方法2 都会导致调用一个组件时需要注意 “前提” 过多的问题,因为既然封装成一个组件,那么 组件B 就不应该受任何具体页面(页面 A) 的内容束缚,页面 A 也不应该考虑 B 组件的实现细节(比如有什么表单),这样才能做到低耦合,通用。

    所以我希望能有这么一个回调:
    layer.open({
    type: 2,
    title: 'layer mobile页',
    area: ['380px', '90%'],
    content: 'http://layer.layui.com/mobile/' ,
    customCallback: function(data) {
    //假如命名成这个
    //在这里可以用data接收返回来的值
    }
    });
    而在组件 B 的页面里我可以主动触发这个回调函数:
    $("#aa").click(function(){
    var data = { id: 1, name:'aaaaa'};
    layer.customCallback(data);//这里是页面B的调用(仅供参考,至少能够有一种方式,能够获取 layer.open 方法参数里的 customCallback 回调函数的引用,以进行主动回调传值)
    });
    0 回复
  • zuijin zuijin
    2016-11-14 12:56:26
    接上面,想了想 layer.customCallback 这种方式调用不太妥,需要考虑 B 页面没有使用 layer 的时候怎样调用 customCallback 的问题
    0 回复
  • Daimali Daimali
    2016-12-12 13:32:30
    [赞] 赞赞,支持,持续关注,已将最新版覆盖到全项目中
    0 回复
  • 云梦情茧 云梦情茧
    2017-01-09 15:17:16
    管理员,升级为3.0,在谷歌浏览器下出现BUG,就是弹出层作为数据提交的页面,当弹出层最大化情况下,提交数据,父页面数据表格部分重新刷新的情况下,滚动条会出现异常。原来的版本没有这个问题。弹出层不在最大化情况下,也不会出现问题。IE11下和火狐浏览器都不会出现问题。
    0 回复
  • 冬天 冬天
    2017-01-11 11:37:41
    @贤心 一直在用layer,很好用,但最近碰到一个很头痛的问题,requriejs 加载的layer 不稳定,本地环境没问题,一旦放到外网,有时候加载页面一直不出来,经排查发现是一直在加载layer.js, 断点发现里面加载是个死循环。 但多刷新几次页面又能出来。 跪求解~
    0 回复
  • 蘇夜 蘇夜
    2017-02-28 10:46:02
    很好,很强大[哈哈]
    0 回复
  • 云峰 云峰 VIP2
    2017-03-04 23:57:45
    必须赞一个[good]
    0 回复
  • 市场-王赛飞 市场-王赛飞
    2017-03-10 18:58:33
    very good!看好你哦!
    0 回复
  • 誓yi個人 誓yi個人 VIP3
    2017-04-12 10:12:53
    最新的layUI里面集成了这个版本吗???
    0 回复
  • lateror lateror
    10天前
    壮哉!我大layer
    0 回复
最近热帖
完全基于 layui 开发的后台管理模板 2608
三层导航怎么做? 615
「源码市场」 正式版本上线 基于layui开发 546
2.0啥时候出啊,新项目要启动了 485
给2.0一些期待 416
麻烦朋友们投个票呗,FLY社区模板+thinkphp5驱动+个人DIY 367
layui整合datatable了么 301
ajax修改资料成功后 怎么进行初始化 页面刷新还是调用登录时的缓存 258
form.render('select') 更新渲染问题 229
select 动态操作不起作用,求助 195
近期热议
完全基于 layui 开发的后台管理模板 35
layui富文本编辑器图片上传无法回显 15
表单校验无效,找了好长时间找不到原因,求大神看下 14
select 动态操作不起作用,求助 10
ajax修改资料成功后 怎么进行初始化 页面刷新还是调用登录时的缓存 10
给2.0一些期待 9
如何给弹出层传参数? 8
文本编辑器出不来 8
laytpl不解析 8
content: 如果是调用本地的html,怎么写 7