移动端 H5 弹出层 fixed 内容可滚动
<div class="alert_wapper">
<div class="wapper">
<!--内容 -->
</div>
</div> <style>
.alert_wapper{
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.70);
z-index: 99;
overflow: auto;
}
.wapper{
display: inline-block;
&:after {
display: block;
content: ".";
height: 0;
line-height: 0;
clear: both;
visibility: hidden;
}
}
</style>
内容会随着wapper的高度 向正常页面滚动一样
移动端 H5 弹出层 fixed 内容可滚动的更多相关文章
- JS弹出层制作,以及移动端禁止弹出层下内容滚动,overflow:hidden移动端失效问题
HTML <div class="layer"> <div class="menu-list"> <span>社会</ ...
- 同学帮帮移动 H5 弹出层类组件:txbb-pop
Txbb.Pop 同学帮帮弹出层类组件,简洁.无依赖,使用 CSS3 实现动画效果. 为什么要再造一遍轮子 弹出层是常见的业务场景,而且弹出层的业务场景很简单,没必要使用大而全的库,并且,我们经常会有 ...
- pc端有弹出层 并有滚动的时候遇到的问题以及解决
有时候页面会遇到这样一个问题,页面有个弹出层 ,弹出层是有动条的,当弹出层滚完的时候,后面的页面也会滚动,但是我们希望是后面的页面不滚动;代码如下 1:弹出层出现的时候设置 $('body').css ...
- 移动端出现弹出层body滚动
$("#box").on("click",function(e){ e.stopPropagation(); e.preventDefault(); $(&qu ...
- div滚动条弹出层效果 (所需要的css文件和js文件,都已经上传到文件里面了progressbar.rar)
<%--总的弹出层--%> <div class="tcck" id="joinclub" style="display:none& ...
- jquery 简单弹出层(转)
预定义html代码:没有 所有代码通过js生成和移除. 预定义css /* 基本弹出层样式 */ .my-popup-overlay { width:100%; height:auto; /* wid ...
- jQuery点击弹出层,弹出模态框,点击模态框消失
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...
- jQuery弹出层插件popbox
都什么年代了,还自己写弹出层插件!是的,①自己写的自己好控制②可定制性高③兼容低版本IE 本插件有以下特性: 样式分离,可定制,纯净无图片 可自定义按钮及按钮的样式.点击事件 可指定选择器选择页面元素 ...
- 在CGridView调用CJuiDialog的弹出层
<?php $this->widget('zii.widgets.grid.CGridView', array( 'id'=>'user-grid', 'dataProv ...
随机推荐
- Kubernetes学习之路(十八)之认证、授权和准入控制
API Server作为Kubernetes网关,是访问和管理资源对象的唯一入口,其各种集群组件访问资源都需要经过网关才能进行正常访问和管理.每一次的访问请求都需要进行合法性的检验,其中包括身份验证. ...
- nginx反向代理解决wechat图片问题
在nginx 中nginx.conf开启反向代理 location ^~ /wechat_image/ { add_header 'Access-Control-Allow-Origin' " ...
- 安装QConf 报错及解决方案
1:提示找不到gdbm.h头文件 /alidata/QConf/agent/qconf_dump.cc:1:18: fatal error: gdbm.h: No such file or direc ...
- 彻底搞清楚python字符编码
在讨论python编码之前,我先了解了几种编码的由来. 一.编码类型 1.ascci码 ascci码由美国人发明,用1个字节(byte)存储英文和字符,前期用了128个,后来新加了其他欧洲国家的符号, ...
- nginx配置转发详解
nginx各项参数的详细配置 本文主要讲解nginx.conf中server部分配置及多路转发问题: server { listen 9090; server_name 127.0.0.1; #cha ...
- Linu之linux系统基础优化和基本命令
Linux系统基础优化和基本命令 网络参数设定命令 ifconfig: 查询,设置网卡和ip等参数 ifup,ifdown: 脚本命令,更简单的方式 ip: 符合指令,直接修改上述功能 编辑网卡配置文 ...
- xshell提示评估过期怎么办?
刚刚打开xshell准备连上虚拟机写代码,结果提示评估过期,真的很气,在百度上找了好久才找到解决办法,现在分享给大家:. 1.复制这个链接在浏览器打开https://www.netsarang.com ...
- Java编辑PPT的柱状图,与内嵌的Excel联动
/** * 条形图:柱形图 的数据写入方法 * @param slide 图表 * @param index 柱状图的下标 * @param data 要填充的数据 * @param titles 内 ...
- jmeter线程组介绍
Jmeter中的测试计划是一直有的,但可以在右侧修改名字,要开始做具体测试设计前,都需要在测试计划下边添加一个线程组,添加路径为鼠标捕获测试计划后,点击鼠标右键->添加->Threads( ...
- Stack Overflow访问问题的处理
一直以来都有访问stackoverflow的习惯,但是老是因为js的问题让人很多操作都操作不了,而且打开的速度也很慢. 原因其实就是stackoverflow使用的google的cdn,于是想彻底一点 ...