HTML

<html>
　　<head>
　　　　<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
　　　　<script src="Jquery.js" type="text/javascript"></script>
　　　　<script src="JavaScript.js" type="text/javascript"></script>
　　</head>
　　<title>Title</title>
　　<body>
　　　　<div id="bodydiv">
　　　　　　<input type="button" id="buttonshow" value="显示" />
　　　　　　<div id="divpopup">
　　　　　　　　<input type="button" id="buttonclose" value="关闭"/>
　　　　　　</div>
　　　　　　<div id="divcover">
　　　　　　</div>
　　　　</div>
　　</body>
</html>

JS(JavaScript.js)

$(function(){
　　$("#buttonshow").click(function(){
　　　　$("#divcover").css("height",$(document).height());
　　　　$("#divcover,#divpopup").show(1000).css("display","block");
　　　　$("#buttonshow").hide(1000);
　　　　$("#buttonclose").click(function(){
　　　　　　$("#divcover,#divpopup").hide(1000);
　　　　　　$("#buttonshow").show(1000);
　　　　});
　　});
});

CSS(StyleSheet.css)

#divpopup
{
　　display:none;
　　position:fixed;
　　z-index:1002;
}
#divcover
{
　　width: 100%;
　　height: 100%;
　　top: 0px;
　　left: 0px;
　　background-color: Gray;
　　position: absolute;
　　display: none;
　　z-index: 1001;
　　opacity:0.50;
}

源码下载：http://files.cnblogs.com/zisezhixin/遮罩层.zip

JQuery-遮罩层的更多相关文章

  1. jQuery遮罩层登录对话框

    用户登录是许多网站必备的功能.有一种方式就是不管在网站的哪个页面,点击登录按钮就会弹出一个遮罩层,显示用户登录的对话框.这用方式比较灵活方便.而现在扫描二维码登录的方式也是很常见,例如QQ.微信.百度 ...

  2. jQuery遮罩层的实现

    遮罩层其实就是一个占据整个页面的半透明效果的页面元素,一般用div实现.页面中实现遮罩层,无非就是为了让用户只能操作弹出窗口的内容,而不允许操作弹出窗口外的内容. 在实现时,我使用了两个div,一个遮 ...

  3. jQuery遮罩层插件

    在网页上常常遇到须要等待非常久的操作,比方导出报表等.为了预防用户点击其它操作或者多次点击同个功能,须要用遮罩层把页面或者操作区盖住.防止用户进行下一步操作.同一时候能够提高界面友好度,让用户知道操作 ...

  4. jquery 遮罩层显示img

    如果点击iframe中的image显示整个页面的遮罩层,可参考如下: http://blog.csdn.net/shiaijuan1/article/details/70160714 具体思路就是,顶 ...

  5. jquery遮罩层

    (function () { //遮罩层实现 zhe zhao ceng kexb 2016.2.24 $.extend($.fn, { mask: function (msg, maskDivCla ...

  6. jQuery遮罩层效果

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. JQuery 遮罩层弹窗

    var str = "<div id=\"zhezhao\" style=\"display:none; background-color: rgba(0 ...

  8. jquery 遮罩层指定位置

    .css .datagrid-mask-msg { position: absolute; top: %; margin-top: -20px; padding: 12px 5px 10px 30px ...

  9. Jquery实现遮罩层，就是弹出DIV周围都灰色不能操作

    <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC & ...

  10. jquery实现div遮罩层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 学习OpenCV——粒子滤波（网上两篇文章总结）

    粒子滤波的理论实在是太美妙了,用一组不同权重的随机状态来逼近复杂的概率密度函数.其再非线性.非高斯系统中具有优良的特性.opencv给出了一个实现,但是没有给出范例,学习过程中发现网络上也找不到.le ...

  2. PostgreSQL 中日期类型转换与变量使用及相关问题

    PostgreSQL中日期类型与字符串类型的转换方法 示例如下: postgres=# select current_date; date ------------ 2015-08-31 (1 row ...

  3. PostgreSQL 系统的基本体系结构

    PostgreSQL 使用客户机/服务器(C/S)的模式提供服务,一个PostgreSQL会话由下列相关的进程(程序)组成: (1)一个服务器端进程.该进程管理数据库文件,接受客户端与数据库的连接,且 ...

  4. Leetcode: Word Pattern II

    Given a pattern and a string str, find if str follows the same pattern. Here follow means a full mat ...

  5. As3 Anchored Container 代码设置锚点旋转

    原文地址:http://jamesvango.co.uk/blog/?p=136

  6. MySQL单表最大限制

    想把一个项目的数据库导出来,然后倒入到自己熟悉的MySQL数据库中进行运行和调试.导出来后,发现sql文件整整有12G多大,忽然想起来,MySQL好像有个叫做容量限制的神奇特性,但是忘了上限是多少了, ...

  7. Python学习总结19：类（二）

    参考:http://python.jobbole.com/82308/ 继承和__slots__属性 1. 继承    在Python中,同时支持单继承与多继承,一般语法如下: class SubCl ...

  8. .NET: C#: StopWatch

    StopWatch class is used for calculate the timespan for that procedure. In Debug Mode it will be very ...

  9. ini,config文件的读取修改

    修改ini配置文件 // 声明INI文件的写操作函数 WritePrivateProfileString() [System.Runtime.InteropServices.DllImport(&qu ...

  10. vs2003打包

    怎样将.Net程序部署到没有安装.Net Framwork的机器上? 部署在.Net 平台下开发的应用程序,需要安装安装对应版本的.Net Framwork,而Vsual Studio 2003并没有 ...