js实现弹出窗口、页面变成灰色并不可操作的例子
function show() //显示隐藏层和弹出层 { var hideobj=document.getElementById("hidebg"); hidebg.style.display="block"; //显示隐藏层 hidebg.style.height=document.body.clientHeight+"px"; //设置隐藏层的高度为当前页面高度 document.getElementById("hidebox").style.display="block"; //显示弹出层 } function hide() //去除隐藏层和弹出层 { document.getElementById("hidebg").style.display="none"; document.getElementById("hidebox").style.display="none"; }
#hidebg { position:absolute;left:0px;top:0px; background-color:#000; width:100%; /*宽度设置为100%,这样才能使隐藏背景层覆盖原页面*/ filter:alpha(opacity=60); /*设置透明度为60%*/ opacity:0.6; /*非IE浏览器下设置透明度为60%*/ display:none; /* http://www.jb51.net */ z-Index:;} #hidebox { position:absolute;width:400px;height:300px;top:200px;left:30%;background-color:#fff;display:none;cursor:pointer;z-Index:;}
hidebg:隐藏背景层div的id
hidebox:消息框div的id
js实现弹出窗口、页面变成灰色并不可操作的例子的更多相关文章
- [转]js来弹出窗口的详细说明
1.警告对话框 <script> alert("警告文字") </script> 2.确认对话框 <script> confirm(" ...
- js实现弹出窗口+遮罩层+tab切换
[功能1]点击约谈按钮,弹出对话框和遮罩层(自己的叫法 专业叫法没有查) [部分重点代码] [下面的方法] (1)获取系统时间如何实现(2)点击如何实现弹出窗口和遮罩层 $(".date_n ...
- jquery-通过js编写弹出窗口
本文转载 本文主要是通过js动态控制div的高度,css控制浮动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...
- 原生JS实现弹出窗口的拖拽
上一篇说了一下弹出窗口功能的实现思路,一般情况下紧接着就会需要做到弹窗的移动,当然现在有很插件.库比如hammer可以使用,效率也非常好.但我觉得还是有必要了解一下原生JS的实现思路及方式,如下: 思 ...
- JS实现当前页弹出窗口,且页面变灰不可操作
使用JS在当前页面在div中加载弹出窗口,并让当前页面变灰不可操作. 加载弹出窗口的div需将宽高设置成整个页面的大小,以覆盖当前页面的内容. opacity:0.6: 页面可见度设置为0.6(1为完 ...
- jquery Jbox 插件实现弹出窗口在修改的数据之后,关闭弹出窗口刷新父页面的问题
http://blog.csdn.net/nsdnresponsibility/article/details/51282797 问题如题: 这里我们在父页面定义一个全局的变量来标识是否需要刷新父页面 ...
- 弹出窗口zDialog的使用
因为没有元素可以显示到Frameset上面去,所以重新定义了,一个index.htm,对其的操作是: Index.htm <script language="javascript ...
- fancybox关闭弹出窗口parent.$.fancybox.close();
fancybox弹出窗口右上角会自带一个关闭窗口,并且点击遮罩层也会关闭fancybox 有时我们不需要这样进行关闭,隐藏关闭窗口,并且遮罩层不可点击 在弹出窗口页面加一链接进行关闭使用parent. ...
- Response.write()弹出窗口的问题!
今天偶然发现在.NET中使用Javascript语句弹出窗口时发现一个小小的问题! 例子如下: 1: Response.Write ("<script languge=javascri ...
随机推荐
- 【LeetCode练习题】Reverse Linked List II
Reverse Linked List II Reverse a linked list from position m to n. Do it in-place and in one-pass. F ...
- GroundworkCSS ♥ Tables
微信公众平台开发(41)一键关注微信公众平台账号 - 方倍工作室 - 博客园 微信公众平台开发(41)一键关注微信公众平台账号 GroundworkCSS ♥ Tables Example Layou ...
- tsm ANS0326E问题处理
备份tsm备份oracle 报错 ANS0326E This node has exceeded its maximum number of mount points. 查看所有节点详细信息 q no ...
- optimizer for eclipse--Eclipse优化,让你的Eclipse快来飞!
官方网站:http://zeroturnaround.com/free/optimizer-for-eclipse/ infoq网址:http://www.infoq.com/cn/news/2015 ...
- golang之interface
一.概述 接口类型是对 "其他类型行为" 的抽象和概况:因为接口类型不会和特定的实现细节绑定在一起:很多面向对象都有类似接口概念,但Golang语言中interface的独特之处在 ...
- js方法在对象中的状态
在C#中,只有对象的字段存储在堆中,而方法则存储在一个方法表中.当实例化多个对象时,为字段分配了内存空间,而方法都指向一个方法表中的同一个方法. 如 而在JS中,字段和方法都属于值类型,都存储在堆中. ...
- javascript模式——Facade
Facade模式为许多代码提供一个方便的接口,不现实代码实现的复杂性,这样,使用者只需要关心他的使用接口就可以使用. 下面来看一段Facade模式的运用,绑定事件在浏览器之间是不一样的,利用Facad ...
- Android 简单的代码混淆
Android的代码混淆是开发者需要了解的相关知识,它能够防止android应用程序的反编译.因为android程序多数是java语言开发的,而java代码很容易被反编译,所以为了使android应用 ...
- android经典Demo(转载)
一篇不错的资源博文,转载分享给大家: 1.Android团队提供的示例项目 如果不是从学习Android SDK中提供的那些样例代码开始,可能没有更好的方法来掌握在Android这个框架上开发. ...
- tomcat 发布webService
<!-- tomcat发布webservice时所需jar --> <dependency> <groupId>com.sun.xml.ws</groupId ...