html:

<div class="popBox">
<div class="pb">
<span class="clousx"></span>
<div class="p-box"></div>
</div>
</div>

css:

.popBox {
position: fixed;
width: 100%;
left: 0;
top: 0;
background: rgba(0,0,0,0.5);
height: 100%;
z-index: 150000;
}
.popBox .pb {
width: 6.58rem;
background: #fff;
display: flex;
justify-content: space-between;
position: relative;
font-size: 0.3rem;
text-align: left;
left: 0.46rem;
padding-top: 0.65rem;
border-radius: 0.1rem;
padding: .92rem .5rem .64rem .3rem;
margin-top: 2rem;
overflow-y: auto;box-sizing: border-box;
}
.popBox .clousx {
position: absolute;
z-index: 20000;
width: 1rem;
height: 0.84rem;
background: url(../images/index/close-icon.png) no-repeat center center;
background-size: 0.32rem 0.32rem;
display: inline-block;
right: 0;
top: 0;
}
.popBox .p-box {
position: relative;
height: 7rem;
overflow-y: auto;
}

JS弹窗遮罩 POP的更多相关文章

  1. js动画 无缝轮播 进度条 文字页面展示 div弹窗遮罩效果

    1.无缝轮播 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.a ...

  2. jQuery 小特效【文本框折叠隐藏,展开显示】【下拉菜单】【颜色渐变】【弹窗+遮罩】

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs& ...

  3. js弹窗 js弹出DIV,并使整个页面背景变暗

    1.首先写一个遮罩层div,然后再写一个弹窗的div <!-- 遮罩层 --> <div id="cover" style="background: # ...

  4. easyui 中iframe嵌套页面,提示弹窗遮罩的解决方法,parent.$.messager.alert和parent.$.messager.confirm

    项目中用到easyui 布局,用到north,west,center三个区域,且在center中间区域嵌入iframe标签.在主内容区做一些小提示弹窗(例如删除前的弹窗提示确认)时,会遇到遮罩问题,由 ...

  5. cefsharp重写默认js弹窗(alert/confirm/prompt)

    1.设置js弹窗控制器 webView.JsDialogHandler = this;  //js弹窗控制 this表示本类对象,所以本类要实现IJsDialogHandler接口 2.实现IJsDi ...

  6. js弹窗

    常用人JS弹窗,lhgDialog 4.20

  7. js弹窗登录效果(源码)--web前端

    1.JS弹窗登录效果 <!DOCTYPE html><html lang="en"><head> <meta charset=" ...

  8. 一行js弹窗代码就能设计漂亮的弹窗广告

    接到一个设计需求,要求xmyanke在网站右侧挂一个弹窗广告宣传最近的活动,找了半天都没看到合适的,自己鼓捣了一行js弹窗代码就能设计漂亮的弹窗广告,来瞧一下,欢迎拍砖提意见,js弹窗广告代码如下: ...

  9. (转)js弹窗&返回值(window.open方式)

    本文转载自:http://hi.baidu.com/z57354658/item/5d5e26b8e9f42fa7ebba93d4 js弹窗&返回值(window.open方式) test.h ...

  10. js中push(),pop(),unshift(),shift()的用法

    js中push(),pop(),unshift(),shift()的用法小结   1.push().pop()和unshift().shift() 这两组同为对数组的操作,并且会改变数组的本身的长度及 ...

随机推荐

  1. Python全栈工程师之从网页搭建入门到Flask全栈项目实战(4) - Flask模板语法与继承

    1.Flask模板介绍 前置:理解渲染机制即上篇笔记中render_template()功能是如何实现的! 1)找到html文件地址 2)读取html文件中的内容 3)替换html中的特殊字符 4)将 ...

  2. python装饰器初级

    global与nonlocal 1.global的作用: 可以在局部空间里直接就该全局名称工具中的数据 代码展示: name = 'moon' #设置了一个全局变量 def fucn(): name ...

  3. CGI、WSGI、uWSGI、ASGI……

    在学习 Python Web 开发时候,可能会遇到诸如 uwsgi.wsgi 等名词,下面通过梳理总结,探究它们之间的关系. CGI CGI(Common Gateway Interface)通用网关 ...

  4. Chaos 测试下的若干 NebulaGraph Raft 问题分析

    Raft 是一种广泛使用的分布式共识算法.NebulaGraph 底层采用 Raft 算法实现 metad 和 storaged 的分布式功能.Raft 算法使 NebulaGraph 中的 meta ...

  5. bitlocker加密如何找密钥解锁

    步骤1:在其他设备上登录[微软账号],地址:https://account.microsoft.com 步骤2:找到[自己的设备],查看[Bitlocker]密钥登录进去能看到[设备],找要解锁的那台 ...

  6. Django框架:8、聚合查询、分组查询、F与Q查询、ORM查询优化、ORM事务操作、ORM常用字段类型、ORM常用字段参数

    Django 数据库 目录 Django 数据库 一.聚合查询 二.分组查询 三.F查询与Q查询 1.F查询 2.Q查询 3.Q查询进阶操作 四.ORM查询优化 1.only与defer 五.ORM事 ...

  7. Redis的数据复制

    介绍 Redis 的复制 Redis 的复制功能分为同步(sync)和命令传播(command propagate)这两个操作 同步操作用于,将从服务器的数据库状态更新至主服务器当前所处的数据库状态: ...

  8. if多条件判断

    在一个if语句中,括号里面包含多个条件时.条件是否被执行要看if语句里面各个条件是"与"的关系还是"或"的关系. #include<stdio.h> ...

  9. 基于 VScode 搭建 STM32 运行环境

    所需软件 vscode: 是我们的代码编辑器 STM32CubeMX: 是我们配置和初始化的软件 OpenOCD: 是开源片上调试器, 他下载完是一个压缩包, 需要配置环境 arm-none-eabi ...

  10. 關於scanf()的使用

    要使用scanf函數進行輸入: 1.如果用scanf()要輸入讀取基本變量的值,需要加&. 2.如果用scanf()讀取的是把字符串讀入字符數組中,則不需要加& 1 #include& ...