JS弹窗遮罩 POP
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的更多相关文章
- js动画 无缝轮播 进度条 文字页面展示 div弹窗遮罩效果
1.无缝轮播 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.a ...
- jQuery 小特效【文本框折叠隐藏,展开显示】【下拉菜单】【颜色渐变】【弹窗+遮罩】
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs& ...
- js弹窗 js弹出DIV,并使整个页面背景变暗
1.首先写一个遮罩层div,然后再写一个弹窗的div <!-- 遮罩层 --> <div id="cover" style="background: # ...
- easyui 中iframe嵌套页面,提示弹窗遮罩的解决方法,parent.$.messager.alert和parent.$.messager.confirm
项目中用到easyui 布局,用到north,west,center三个区域,且在center中间区域嵌入iframe标签.在主内容区做一些小提示弹窗(例如删除前的弹窗提示确认)时,会遇到遮罩问题,由 ...
- cefsharp重写默认js弹窗(alert/confirm/prompt)
1.设置js弹窗控制器 webView.JsDialogHandler = this; //js弹窗控制 this表示本类对象,所以本类要实现IJsDialogHandler接口 2.实现IJsDi ...
- js弹窗
常用人JS弹窗,lhgDialog 4.20
- js弹窗登录效果(源码)--web前端
1.JS弹窗登录效果 <!DOCTYPE html><html lang="en"><head> <meta charset=" ...
- 一行js弹窗代码就能设计漂亮的弹窗广告
接到一个设计需求,要求xmyanke在网站右侧挂一个弹窗广告宣传最近的活动,找了半天都没看到合适的,自己鼓捣了一行js弹窗代码就能设计漂亮的弹窗广告,来瞧一下,欢迎拍砖提意见,js弹窗广告代码如下: ...
- (转)js弹窗&返回值(window.open方式)
本文转载自:http://hi.baidu.com/z57354658/item/5d5e26b8e9f42fa7ebba93d4 js弹窗&返回值(window.open方式) test.h ...
- js中push(),pop(),unshift(),shift()的用法
js中push(),pop(),unshift(),shift()的用法小结 1.push().pop()和unshift().shift() 这两组同为对数组的操作,并且会改变数组的本身的长度及 ...
随机推荐
- 单一接口优化过程全记录(主要涉及Redis)
接口优化过程记录 问题背景 某个接口耗时长(247ms),但里面逻辑不算复杂,只进行了简单的对象引用以及操作了多次Redis 步骤1:链路追踪,确定业务耗时点 接口里通过链路追踪以及日志查询发现主要是 ...
- HMS Core 6.8.0版本发布公告
分析服务 ◆ 游戏行业新增"区服分析"埋点模板及分析报告,支持开发者分服务器查看用户付费.留存等指标,可进一步评估不同服务器的玩家质量: ◆ 新增营销活动报告,可查看广告任务带来的 ...
- python中的字符串(1)
1.大小写的转换 upper()/lower() 转成大写.upper() 转成小写.lower() 返回的是字符串 2.是否是数字 isdigit() 返回的布尔值 3.去除字符串的空白字符 str ...
- 铁威马NAS如何开启二次验证提高系统安全性
想到登录TNAS时更安全?直接开启OTP二次验证,通过 TNAS mobile生成的一次性密码登录NAS存储,简单设置,提升TOS系统访问安全性给你TNAS双重保护. 1.首先,确认你的TOS系统在5 ...
- Django路由层之路由分发 名称空间 虚拟环境 视图层之三板斧 JsonRsponse对象 request对象获取文件 FBV与CBV CBV源码剖析 模板层
目录 路由层之路由分发 路由层之名称空间 方式1:名称空间 方式2:别名不冲突即可 虚拟环境 pycharm创建虚拟环境 命令行形式创建虚拟环境 视图层之三板斧 HttpRsponse render ...
- vue中mixins(混入)的用法
vue中mixin的使用详解 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能.一个混入对象可以包含任意组件选项.当组件使用混入对象时,所有混入对象的选项将被&quo ...
- Spring Cloud Alibaba组件之Sentinel
目录 一 引入Sentinel学习 二 Sentinel入门 三 搭建Sentinel Dashboard 四 Springboot项目接入Sentinel 五 接入限流埋点 六 限流配置 七 熔断降 ...
- SimpleMemory使用
官方文档: 简介 - Document (bndong.github.io) Github资源链接: BNDong/Cnblogs-Theme-SimpleMemory: Cnblogs theme ...
- Java基础篇——常用类
Objec类 Test t1 = new Test(); Test t2 = new Test(); //toString方法,对某个对象的字符串输出 //getClass方法,返回该对象的Class ...
- jQuery查找标签、操作标签、事件和动画效果,Bootstrap页面框架的介绍和使用讲解
今日内容 jQuery查找标签 1.基本选择器: $('#d1') id选择器 $('.c1') class选择器 $('div') 标签选择器 2.组合选择器: $('div#d1') 查找id是d ...