layui在当前页面弹出层的HTML

简介: layui在当前页面弹出层的HTML

封装弹出层调用函数

/*弹出层*/
function getDiv(title, id, w, h) {
    if (title == null || title == '') {
        title = false;
    }
    if (w == null || w == '') {
        w = ($(window).width() * 0.9);
    }
    if (h == null || h == '') {
        h = ($(window).height() - 50);
    }
    layer.open({
        type: 1,
        area: [w + 'px', h + 'px'],
        title: false,  //title: title,
        fix: false, //不固定
        maxmin: false,
        shadeClose: true,
        closeBtn: 2,//关闭按钮,0不显示,1和2两种风格;
        anim: 3,//弹出动画,0~6;
        shade: 0.6,//遮罩层
        skin: 'layui-layer-nobg layer_bg', //没有背景色
        content: $(id),
    });
}


HTML页面调用

     <div class="ctitle">年龄占比分析
                            <span class="laybg new2" onClick="getDiv('年龄占比分析','#popup2',750,550)"><i class="icon2">
                                &#xe6b4;</i></span>
                            <div id="ages"></div>
                        </div>

HTML页面要显示的层

<!--弹窗内容 Begin-->
<!--年龄-->
<div class="popup" id="popup2">
    <div id="ages2" style="width:750px;height:550px;"></div>
</div>
<!--弹窗信息 End-->

Done !

相关文章
HTML+CSS 实现通用的企业官网页面(记得收藏)
HTML+CSS 实现通用的企业官网页面(记得收藏)
|
5天前
|
JavaScript 前端开发 Java
SpringBoot项目的html页面使用axios进行get post请求
SpringBoot项目的html页面使用axios进行get post请求
18 6
html,web页面朗读文字,朗读中文,朗读英文
html,web页面朗读文字,朗读中文,朗读英文
|
2月前
|
数据安全/隐私保护
自定义密码访问跳转页面HTML源码
自定义密码访问跳转页面HTML源码,源码由HTML+CSS+JS组成,记事本打开源码文件可以进行内容文字之类的修改,双击html文件可以本地运行效果,也可以上传到服务器里面,重定向这个界面
37 0
自定义密码访问跳转页面HTML源码
|
2月前
|
移动开发 HTML5
HTML5页面元素及属性
【8月更文挑战第23天】HTML5页面元素及属性。
36 4
HTML+CSS 实现带轮播图的企业官网页面(记得收藏)
HTML+CSS 实现带轮播图的企业官网页面(记得收藏)
HTML+CSS 星空闪烁登录页面(记得收藏)
HTML+CSS 星空闪烁登录页面(记得收藏)
HTML+CSS 登录页面(记得收藏)
HTML+CSS 登录页面(记得收藏)
|
2月前
|
XML JavaScript 测试技术
Web自动化测试框架(基础篇)--HTML页面元素和DOM对象
本文为Web自动化测试入门指南,介绍了HTML页面元素和DOM对象的基础知识,以及如何使用Python中的Selenium WebDriver进行元素定位、操作和等待机制,旨在帮助初学者理解Web自动化测试中的关键概念和操作技巧。
40 1
|
2月前
|
移动开发 前端开发 JavaScript
大气实用的HTML5/CSS3个人中心页面(含源码)
大气实用的HTML5/CSS3个人中心页面(含源码)