<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<div style="background-color: #00A770;height: 5000px">123</div>

<div style="background-color: black;z-index: 9;position: fixed;

top: 0;

bottom: 0;

left: 0;

right: 0;

opacity: 0.5;

"></div>

<div style="background-color: white;height: 200px;width:400px;z-index: 10;

position: fixed;top: 50%;left: 50%;margin-top: -100px;margin-left: -200px">

    <input type="text">

    <input type="text">

</div>

</body>

</html>

注意：opacity 设置透明度0.5

　　z-index    层级顺序　　

效果如下图

css分层,实现遮罩底层弹出新窗口里可以操作，最下层能看到单不能操作的更多相关文章

  1. chrome偶尔弹出新窗口的解决方案

    最近使用谷歌浏览器,在搜索页点击搜索结果时,偶尔会弹出新窗口,而不是新标签,试验发现,只要将chrome里面安装的google drive app卸载就行了. 当然了,如果此方法不适合你的情况,还可以 ...

  2. js弹出新窗口居中

    方式1: <script language="javascript"> var newUrl = <%=newUrl % > //window.locati ...

  3. 【WPF】监听WPF的WebBrowser控件弹出新窗口的事件

    原文:[WPF]监听WPF的WebBrowser控件弹出新窗口的事件 WPF中自带一个WebBrowser控件,当我们使用它打开一个网页,例如百度,然后点击它其中的链接时,如果这个链接是会弹出一个新窗 ...

  4. 点击grid单元格弹出新窗口

    实现功能:点击指定单元格后会弹出新窗口,并且最后一行合计不会触发单元格触发函数 <script type="text/javascript"> grid.on('cel ...

  5. 解决以showModalDialog打开的页面在提交表单时弹出新窗口的问题

    源代码如下: 父页面: window.showModalDialog("../readfile/readFile.jsp","","dialogWid ...

  6. jsp弹出新窗口代码

    1.最基本的弹出窗口代码其实代码非常简单: <SCRIPT LANGUAGE="javascript"> <!-- window.open (page.html) ...

  7. js如何弹出新窗口

    js如何弹出新窗口 时间:2012-4-22 弹出新窗口也是在网页设计中会经常用到的,其用法也很简单,是通过调用javascript的内置函数windows.open来产生的.  window.ope ...

  8. window.open浏览器弹出新窗口被拦截—原因分析和解决方案

    最近在做项目的时候碰到了使用window.open被浏览器拦截的情况,在本机实验没问题,到了服务器就被拦截了,火狐有拦截提示,360浏览器拦截提示都没有,虽然在自己的环境可以对页面进行放行,但是对用户 ...

  9. flex 在父窗口监听弹出窗口里的某个按钮被点击

    flex 在父窗口监听弹出窗口里的某个按钮被点击 这样可以从子窗口拿回数据在父窗口处理数据,不必再子窗口中处理.在某些情形下省去了不少麻烦. /** * 右键菜单项单击事件 * changed by ...

随机推荐

  1. Eclipse设置每行代码的长度

    打开 Window -> preferences -> java -> code style -> formatter -> edit -> line wrappi ...

  2. PHP 获取acm近期比赛

    <?php // author: Moore Jiang. ini_set('display_errors',1); //错误信息 ini_set('display_startup_errors ...

  3. java——String、StringBuffer、StringBuilder、包装类、单双引号

    String: String是一个特殊的类,被定义为final类型,为字符串常量,同样的字符串在常量池中不能重复. 但是由于使用关键字new创建新的字符串,java会在对中分配新的空间,这样即使字符串 ...

  4. QT 简单的计算器例子

    开发工具:vs2010.qt5.1 1使用vs新建工程,Base Class 选择QDialog

  5. 深入理解C#中的IDisposable接口(转)

    转自:https://www.cnblogs.com/wyt007/p/9304564.html 写在前面 在开始之前,我们需要明确什么是C#(或者说.NET)中的资源,打码的时候我们经常说释放资源, ...

  6. Maven的学习资料收集--（九） 构建SSH项目以及专栏maven

    在这里整合一下,使用Maven构建一个SSH项目 1.新建一个Web项目 可以参照前面的博客 2.添加依赖,修改pom.xml <project xmlns="http://maven ...

  7. android 开发-系统设置界面的实现

    具体与Preference的用法类似,这里就不做过多解释,直接贴示例代码,需要在res下新建xml文件夹,在xml文件夹下添加xml文件. xml:(注意:root节点是:PreferenceScre ...

  8. android 开发-数据存储之共享参数

    android提供5中数据存储方式 数据存储之共享参数 内部存储 扩展存储 数据库存储 网络存储  而共享存储提供一种可以让用户存储保存一些持久化键值对在文件中,以供其他应用对这些共享参数进行调用.共 ...

  9. android 开发-ListView与ScrollView事件冲突处理(事件分发机制处理)

    ListView和ScrollView都存在滚动的效果,所以一般不建议listView和scrollView进行嵌套使用,但有些需求则需要用到两者嵌套.在android的学习中学了一种事件分发处理机制 ...

  10. 从零开始的全栈工程师——html篇1.8（知识点补充与浏览器兼容性）

    知识点补充 一.浏览器的兼容问题(关于浏览器的兼容问题 有很多大佬已经解释的很清楚了 这个得自己百度去多花点时间去了解 这里咱们只说一下前面的漏点) 浏览器兼容性问题又被称为网页兼容性或网站兼容性问题 ...