<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/public.css"/>
    <link rel="stylesheet" href="css/1.css"/>
    <title></title>
</head>
<body>
<div class="add_deploy">点击</div>
<div class="layer_bg"></div>
<div class="layer_con">
    <h5 class="tc">配置</h5>
    <div class="layer_main">222</div>
    <div class="close">x</div>
</div>
</body>
<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/1.js"></script>
</html>
/*公共样式--开始*/
html, body, div, ul, li, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, form, input, textarea, th, td, select {
    margin:;
    padding:;
}

* {
    box-sizing: border-box;
}

html, body {
    min-height: 100%;
}

body {
    font-family: "Microsoft YaHei";
    font-size: 14px;
    color: #333;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}

ul, li {
    list-style: none;
}

img {
    border: none;
    vertical-align: middle;
}

a {
    text-decoration: none;
    color: #232323;
}

table {
    border-collapse: collapse;
    table-layout: fixed;
}

input, textarea {
    outline: none;
    border: none;
}

textarea {
    resize: none;
    overflow: auto;
}

.clearfix {
    zoom:;
}

.clearfix:after {
    content: ".";
    width:;
    height:;
    visibility: hidden;
    display: block;
    clear: both;
    overflow: hidden;
}

.fl {
    float: left
}

.fr {
    float: right
}

.tl {
    text-align: left;
}

.tc {
    text-align: center
}

.tr {
    text-align: right;
}

.ellipse {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inline {
    display: inline-block;
    *display: inline;
    *zoom:;
}

.blue {
    color: #208adb;
}

.red {
    color: red;
}

.green {
    color: green;
}

/*公共样式--结束*/
.layer_bg {
    display: none;
    width: 100%;
    z-index:;
    position: fixed;
    background-color: #000;
    opacity: 0.3;
    top:;
    height:100%;
    filter: alpha(opacity=30);
}

.layer_con {
    display: none;
    width: 560px;
    padding-bottom: 20px;
    background-color: #fff;
    z-index:;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -280px;
    opacity:;
    filter: alpha(opacity=100);
}

.close {
    font-size: 40px;
    background-color: #c43737;
    width: 50px;
    height: 50px;
    line-height: 44px;
    text-align: center;
    color: #fff;
    padding:;
    margin:;
    position: absolute;
    right: -50px;
    top:;
    cursor: pointer;
}

.layer_con h5 {
    width: 510px;
    height: 68px;
    line-height: 68px;
    margin: 0 auto;
    font-size: 24px;
    color: #208adb;
    border-bottom: 1px solid #208adb;
    font-weight: normal;
}

.layer_main {
    padding-top: 46px;
    overflow-y: auto
}
$(function() {
    /*删除--弹框--开始*/
    $(".add_deploy").on("click",function(){
        layer($(this));
    });
    function layer(small){
        var $con=$(".layer_con").height();
        $(".layer_bg").css({"display":"block"});
        $(".layer_con").css({"display":"block","margin-top":-$con/2});
    }
    $(".close,.layer_cancel").on("click",function(){
        $(this).parents(".layer_con").css("display","none");
        $(".layer_bg").css("display","none");
    });
    /*删除--弹框--结束*/
});

弹出框--self的更多相关文章

  1. 关于Layer弹出框初探

    layer至今仍作为layui的代表作,她的受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自发传播,乃至于成为今天的Layui最强劲的源动力.目前,laye ...

  2. angularjs 弹出框 $modal

    angularjs 弹出框 $modal 标签: angularjs 2015-11-04 09:50 8664人阅读 评论(1) 收藏 举报  分类: Angularjs(3)  $modal只有一 ...

  3. 【代码笔记】iOS-自定义弹出框

    代码: - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. [s ...

  4. Android----消息弹出框

    关于Android的知识,自从工作了就没有什么时间去总结学习过的知识,我个人比较喜欢学习后总结,今天就写一下关于android中消息弹出框的几种方式的简单示例,按照自己的思路写了一段,希望对和我一样在 ...

  5. bootstrap中popover.js(弹出框)使用总结+案例

    bootstrap中popover.js(弹出框)使用总结+案例 *转载请注明出处: 作者:willingtolove: http://www.cnblogs.com/willingtolove/p/ ...

  6. div非弹出框半透明遮罩实现全屏幕遮盖css实现

    IE浏览器下设置元素css背景为透明: background-color: rgb(0, 0, 0); filter: alpha(opacity=20); 非IE浏览器下设置元素css背景为透明: ...

  7. Visual Studio 打开解决方案后 弹出框显示 "正在打开文件..." 迟迟没反应 的解决方法

    Visual Studio 打开解决方案后 弹出框显示 "正在打开文件...",任务管理器的devenv进程又很正常,不会显示"未响应". 而IDE的左下角有个 ...

  8. 使用jsonp跨域调用百度js实现搜索框智能提示，并实现鼠标和键盘对弹出框里候选词的操作【附源码】

    项目中常常用到搜索,特别是导航类的网站.自己做关键字搜索不太现实,直接调用百度的是最好的选择.使用jquery.ajax的jsonp方法可以异域调用到百度的js并拿到返回值,当然$.getScript ...

  9. JS组件系列——Bootstrap寒冬暖身篇：弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  10. angularjs 弹出框 $modal 参数（转）

    angularjs 弹出框 $modal   $modal只有一个方法:open,该方法的属性有: templateUrl:模态窗口的地址 template:用于显示html标签 scope:一个作用 ...

随机推荐

  1. join（添加字符）与id显示

    #!/usr/bin/env python li = ["alex",'sb'] l1 = "_".join(li) print(l1) print(id(li ...

  2. JQuery多媒体插件jQuery Media Plugin使用详解

    malsup jquery media plugin 该插件可以播放多种类型的多媒体文件包括:Flash, Quicktime, Windows Media Player, Real Player, ...

  3. BZOJ 3434 时空穿梭

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3434 题意: 思路: const int mod=10007; const int N=1 ...

  4. UVA 1452 八 Jump

    Jump Time Limit:3000MS     Memory Limit:0KB     64bit IO Format:%lld & %llu Submit Status Practi ...

  5. mysql更改已有数据表的字符集，保留原有数据内容

    mysql更改已有数据表的字符集,保留原有数据内容     原文网址:http://blog.csdn.net/learn_2/article/details/6460370 环境:在应用开始阶段没有 ...

  6. Topic Model

    Topic Model 标签(空格分隔): 机器学习 \(\Gamma\)函数 \(\Gamma\)函数可以看做是阶乘在实数域上的推广,即: \(\Gamma(x) = \int_{0}^{+\inf ...

  7. V-rep学习笔记：机器人逆运动学数值解法（The Jacobian Transpose Method）

    机器人运动学逆解的问题经常出现在动画仿真和工业机器人的轨迹规划中:We want to know how the upper joints of the hierarchy would rotate ...

  8. MySQL用户名和密码问题

    MySQL使用脚本的方法: source d:\datafilename.sql # mysql -uroot -p Enter password: ERROR 1045 (28000): Acces ...

  9. iOS 框架收集

    检测硬件设备信息 https://github.com/Shmoopi/iOS-System-Services

  10. Windows Internals学习笔记（一）概念与工具

    参考资料: 1. <Windows Internals> 2. Windows Drive Kit 3. Microsoft Windows SDK 4. WDK下载地址 知识点: 1. ...