layer设置maxWidth及maxHeight解决方案


Posted in Javascript onJuly 26, 2019

layer介绍

layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验。下载及使用访问官方网站。

area属性

layer的宽高是通过area属性设置,例如 area:[‘300px',‘600px'],表示定义宽300px;高600px的弹出层;

默认设置:layer宽高都自适应的,即area默认值为‘auto'。

maxWidth及maxHeight属性

‘maxWidth'和‘maxHeight'分别对应css中‘max-width'及‘max-height',若想设置该属性,并让其起作用,必须将area属性设置为默认设置(area: 'auto')。

示例代码

layer.open({
    type: 1,
    title: '属性信息',     //弹出层标题
    area: 'auto',      //宽高自适应
    maxHeight:'600px',    //最大高度600像素
    shadeClose: true,     //点击遮罩关闭
    content: html       //弹出层内容
  });

总结

以上所述是小编给大家介绍的layer设置maxWidth及maxHeight解决方案,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
jQuery弹出层插件简化版代码下载
Oct 16 Javascript
jQuery使用CSS()方法给指定元素同时设置多个样式
Mar 26 Javascript
jQuery Ajax中的事件详细介绍
Apr 16 Javascript
深入理解关于javascript中apply()和call()方法的区别
Apr 12 Javascript
BootStrap智能表单实战系列(六)表单编辑页面的数据绑定
Jun 13 Javascript
jquery 校验中国身份证号码实例详解
Apr 11 jQuery
微信小程序开发之数据存储 参数传递 数据缓存
Apr 13 Javascript
深入理解ES7的async/await的用法
Sep 09 Javascript
vue利用better-scroll实现轮播图与页面滚动详解
Oct 20 Javascript
仿vue-cli搭建属于自己的脚手架的方法步骤
Apr 17 Javascript
微信小程序自定义tabbar custom-tab-bar 6s出不来解决方案(cover-view不兼容)
Nov 01 Javascript
react-intl实现React国际化多语言的方法
Sep 27 Javascript
javascript中的闭包概念与用法实践分析
Jul 26 #Javascript
layui自定义插件citySelect实现省市区三级联动选择
Jul 26 #Javascript
微信小程序自定义头部导航栏和导航栏背景图片 navigationStyle问题
Jul 26 #Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
Jul 26 #jQuery
微信小程序—setTimeOut定时器的问题及解决
Jul 26 #Javascript
layUI实现三级导航菜单效果
Jul 26 #Javascript
layui实现三级联动效果
Jul 26 #Javascript
You might like
php实现12306余票查询、价格查询示例
2014/04/17 PHP
yii操作session实例简介
2014/07/31 PHP
php实现通用的从数据库表读取数据到数组的函数实例
2015/03/21 PHP
PHP实现接收二进制流转换成图片的方法
2017/01/10 PHP
使用PHPExcel导出Excel表
2018/09/08 PHP
Ajax+Jpgraph实现的动态折线图功能示例
2019/02/11 PHP
ExtJS的FieldSet的column列布局
2009/11/20 Javascript
javascript利用初始化数据装配模版的实现代码
2010/11/17 Javascript
深入理解JavaScript是如何实现继承的
2013/12/12 Javascript
js弹窗返回值详解(window.open方式)
2014/01/11 Javascript
js用Date对象的setDate()函数对日期进行加减操作
2014/09/18 Javascript
js实现a标签超链接提交form表单的方法
2015/06/24 Javascript
jQuery Validate验证框架经典大全
2015/09/23 Javascript
JS实现Select的option上下移动的方法
2016/03/01 Javascript
基于BootStrap Metronic开发框架经验小结【七】数据的导入、导出及附件的查看处理
2016/05/12 Javascript
javascript时间差插件分享
2016/07/18 Javascript
js读取json文件片段中的数据实例
2017/03/09 Javascript
vue-cli 目录结构详细讲解总结
2019/01/15 Javascript
jQuery实现的导航条点击后高亮显示功能示例
2019/03/04 jQuery
vue实现路由懒加载的3种方法示例
2020/09/01 Javascript
js简单粗暴的发布订阅示例代码
2021/01/23 Javascript
[51:15]2014 DOTA2国际邀请赛中国区预选赛 Orenda VS LGD-GAMING
2014/05/22 DOTA
[02:32]DOTA2亚洲邀请赛 C9战队出场宣传片
2015/02/07 DOTA
python实现去除下载电影和电视剧文件名中的多余字符的方法
2014/09/23 Python
在Python的Flask框架中使用模版的入门教程
2015/04/20 Python
python获取一组数据里最大值max函数用法实例
2015/05/26 Python
python学习笔记之调用eval函数出现invalid syntax错误问题
2015/10/18 Python
python删除不需要的python文件方法
2018/04/24 Python
Python使用Matplotlib模块时坐标轴标题中文及各种特殊符号显示方法
2018/05/04 Python
python将一组数分成每3个一组的实例
2018/11/14 Python
python时间序列数据转为timestamp格式的方法
2020/08/03 Python
台湾百利市购物中心:e-Payless
2017/08/16 全球购物
世界上最具创新性的增强型知名运动品牌:Proviz
2018/04/03 全球购物
切尔西足球俱乐部官方网上商店:Chelsea FC
2019/06/17 全球购物
SEPHORA丝芙兰德国官方购物网站:化妆品、护肤品和香水
2020/01/21 全球购物
python 闭包函数详细介绍
2022/04/19 Python