弹出层（Div）屏蔽父窗口并且让父窗口变暗

最新推荐文章于 2018-06-20 14:03:27 发布
最新推荐文章于 2018-06-20 14:03:27 发布
阅读量99 收藏
点赞数
文章标签： 框架 CMS .net HTML 
<html>  
<head>  
    <script>      
  function   locking(){      
  document.all.ly.style.display="block";      
  documentdocument.all.ly.style.width=document.body.clientWidth;      
  documentdocument.all.ly.style.height=document.body.clientHeight;      
  document.all.Layer2.style.display='block';      
  }      
  function   Lock_CheckForm(theForm){      
  document.all.ly.style.display='none';document.all.Layer2.style.display='none';   
  return   false;      
  }      
    </script>  
  
</head>  
<body>  
    <img src="http://powereasy.net/skin/since07/images/sf_cms_banner1.jpg">  
    <p align="center">  
        <input type="button" value="系统锁定" οnclick="locking()">  
    </p>  
    <div id="ly" style="position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;   
        z-index: 2; left: 0px; display: none;">  
    </div>  
    <!--         浮层框架开始         -->  
    <div id="Layer2" align="center" style="position: absolute; z-index: 3; left: expression((document.body.offsetWidth-540)/2); top: expression((document.body.offsetHeight-170)/2);   
        background-color: #fff; display: none;" >  
        <table width="540" border="0" cellpadding="0" cellspacing="0" style="border: 0   solid   #e7e3e7;   
            border-collapse: collapse">  
            <tr>  
                <td style="background-color: #73A2d6; color: #fff; padding-left: 4px; padding-top: 2px;   
                    font-weight: bold; font-size: 14px;" height="27" valign="middle">  
                    [&nbsp;警&nbsp;告&nbsp;]   
                </td>  
            </tr>  
            <tr>  
                <td height="130" align="center">  
                    <input type="button" value=" 确定 " οnclick="Lock_CheckForm(this);">  
                </td>  
            </tr>  
        </table>  
    </div>  
    <!--         浮层框架结束         -->  
</body>  
</html>

 

ldxfsh
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
弹出层（Div）屏蔽父窗口并且让父窗口变暗 .
guohongwei12的博客
11-08 406
01. 02. 03. 17. 18. 19. 20. 21. 22. 23. 24. 26. 27. 28. 30. 33. 34. 37. ...
【Qt】弹出子窗口时禁用主窗口
zhenguo26的博客
02-19 3125
转载： https://blog.csdn.net/kaspar1992/article/details/75984022   子窗口名：userManagerDialog Qt::WindowFlags flags = Qt::Dialog; userManagerDialog-&gt;setWindowFlags(flags); 弹出子窗口时禁用主窗口 userManagerDia...
点击后画面弹框背景变灰阴影层
weixin_30681615的博客
03-28 1327
　　实现页面功能的时候经常会遇到一个小功能需求：点击画面一个按钮，画面弹出信息页面，同时背景变暗（背景变暗其实是有个灰色半透明的全屏div遮住了原来的页面）且不可操作，信息页面操作关闭后恢复正常。 　　先简要理一下实（shuo）现（ren）思（hua）路： 点击事件之后要呈现半透明灰色背景挡住原页面 灰色背景之上弹出对话框（或是信息页面） 对话框关闭按下之后，对话框消失 灰色背景消失...
JS+CSS实现Div弹出窗口同时背景变暗的方法
10-24
本文将详细介绍如何使用JavaScript（JS）和层叠样式表（CSS）来实现一个Div弹出窗口，并使背景变暗的效果。 首先，我们需要理解页面布局的基本原理。在HTML中，我们定义了弹出窗口的结构以及一个按钮用于触发弹出...
jQuery实现弹出窗口弹出div层的实例代码
10-20
在IT行业内，掌握使用jQuery实现特定功能的代码是一项必备技能，本实例将详细介绍如何利用jQuery实现点击链接弹出一个div层的同时，使页面的其他部分变灰并不可交互，且该弹出层能够在浏览器窗口大小改变或滚动条...
如何创建一个JavaScript弹出DIV窗口层的效果
10-26
创建JavaScript弹出DIV窗口层效果的知识点主要包括以下几点： 1. 传统JavaScript弹窗的不足：传统JavaScript弹窗体验不友好，容易打断用户操作流程，并且存在兼容性问题，如部分浏览器屏蔽了Alert()方法。 2. 现代...
jQuery实现单击弹出Div层窗口效果(可关闭可拖动)
10-23
在本文中，我们将深入探讨如何使用jQuery来实现一个可单击弹出的Div层窗口，同时具备可关闭和拖动的功能。这个功能在许多网页应用中都非常常见，它能够为用户提供交互式的用户体验，例如提示信息、用户反馈或者简单...
jQuery Layer弹出层传值到父页面的实现代码
10-19
在使用jQuery Layer插件开发Web应用时，经常会遇到需要在弹出层（Layer）中进行数据输入，并将这些输入的数据传回父页面进行处理的情况。本文将介绍如何实现这一功能，具体到使用jQuery Layer创建的弹出层中的输入...
Qt笔记之-- 一种利用遮罩窗口突出显示弹窗的方法（Qt5.9.5的工程）
04-18
本问将介绍如何利用Qt实现高亮弹窗效果（窗口亮度调节，注意，不是透明度），即在弹出窗口时，主窗口亮度变暗，弹出窗口高亮显示（其实弹出窗口是正常显示的，只是背景变暗了，突出显示了弹窗）下面是动态显示效果图。
qt--主窗口中按钮弹出子窗口，并把主窗口信号发送给子窗口
05-16
qt--主窗口中按钮弹出子窗口，并把主窗口信号发送给子窗口
Qt软件在看代码的时候有时候出现界面变灰无响应问题解决办法
小明的专栏
06-20 2457
问题描述：在Ubuntu16.04使用Qt5.7看代码的时候界面变灰无响应，需要等一会才能正常操作解决办法：删除Qt项目配置文件rm -rf .config/QtProject
Qt 弹出一个灰色半透明的子窗口,使主窗口上任何按键也点不了
zhouxiao2009的专栏
02-09 4395
//有时候弹出一个窗口时,需要将原来窗口变灰,以下提供了一种方法 QWidget *widget = new QWidget(this,Qt::FramelessWindowHint); widget->resize(this->size()); widget->setObjectName("widget");// 设置对象句,相当于css里的id widget
Winform 简单实现关机背景变灰效果的对话框
maxwellno1的专栏
02-18 1425
声明：这个方法是我自己想到的，没有借助任何其他文章，所以无论前人有没有相同或相似的实现方式，对我而言是原创。 进入正题： 最近在写框架，虽然控件写过不少，单对话框的风格没有做过。今天和同事聊天，说起关机背景变灰式的对话框感觉效果蛮不错的。回家后思考片刻有了下面的文章。 其实思路相当简单，在窗体和对话框之间再加一层透明的灰色层就ok了。这一层用什么来做，方法很多，panel、p
DIV弹出层无法遮罩ActiveX控件的解决方案
weixin_30821731的博客
10-10 182
使用JS做DIV弹出层时，一般地在IE下是无法遮罩ActiveX控件的，同时在IE6下Select也遮罩不住。在IE中ActiveX默认永远显示在最顶层，因此通过设置Style的Z-Index属性也无法改变遮罩关系的。在信息系统软件中，许多场合由于性能、操作等原因，往往会使用ActiveX代替Html来完成功能，从而成为不可回避的问题。 var sd = XX.style.di...
点击事件弹出div窗口
最新发布
04-05
以下是一个简单的HTML代码，用于在点击按钮时弹出一个div窗口： ```html <!DOCTYPE html> <html> <head> <title></title> <style> #popup { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 300px; height: 200px; background-color: lightgray; padding: 20px; text-align: center; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); } </style> </head> <body> <button id="btn">点击弹出窗口</button> <div id="popup"> <h2>这是一个弹出窗口</h2> <p>这里可以放置一些内容</p> <button id="close">关闭</button> </div> <script> var btn = document.getElementById("btn"); var popup = document.getElementById("popup"); var close = document.getElementById("close"); btn.onclick = function() { popup.style.display = "block"; } close.onclick = function() { popup.style.display = "none"; } </script> </body> </html> ``` 在这个示例中，我们使用CSS将弹出窗口设置为绝对定位，并将其放置在页面的中心位置。我们还使用JavaScript在按钮单击事件和关闭按钮单击事件上添加了事件侦听器，以便在单击按钮时显示弹出窗口，并在单击关闭按钮时隐藏弹出窗口。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值