(function () {
//遮罩层实现 zhe zhao ceng kexb 2016.2.24
$.extend($.fn, {
mask: function (msg, maskDivClass) {
this.unmask();
// 参数
var op = {
opacity: 0.8,
z: ,
bgcolor: '#ccc'
};
var original = $(document.body);
var position = { top: , left: };
if (this[] && this[] !== window.document) {
original = this;
position = original.position();
}
// 创建一个 Mask 层,追加到对象中
var maskDiv = $('<div class="maskdivgen">&nbsp;</div>');
maskDiv.appendTo(original);
var maskWidth = original.outerWidth();
if (!maskWidth) {
maskWidth = original.width();
}
var maskHeight = original.outerHeight();
if (!maskHeight) {
maskHeight = original.height();
}
maskDiv.css({
position: 'absolute',
top: position.top,
left: position.left,
'z-index': op.z,
width: "100%",//maskWidth,
height:"30%", //maskHeight,
'background-color': op.bgcolor,
opacity:
});
if (maskDivClass) {
maskDiv.addClass(maskDivClass);
}
if (msg) {
var msgDiv = $('<div style="position:absolute;border:#6593cf 1px solid; padding:2px;background:#ccca"><div style="line-height:24px;border:#a3bad9 1px solid;background:white;padding:2px 10px 2px 10px">' + msg + '</div></div>');
msgDiv.appendTo(maskDiv);
var widthspace = (maskDiv.width() - msgDiv.width());
var heightspace = (maskDiv.height() - msgDiv.height());
msgDiv.css({
cursor: 'wait',
top: (heightspace / - ),
left: (widthspace / - )
});
}
maskDiv.fadeIn('fast', function () {
// 淡入淡出效果
$(this).fadeTo('slow', op.opacity);
})
return maskDiv;
},
unmask: function () {
var original = $(document.body);
if (this[] && this[] !== window.document) {
original = $(this[]);
}
original.find("> div.maskdivgen").fadeOut('slow', , function () {
$(this).remove();
});
}
});
})();

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遮罩层效果

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

  6. JQuery 遮罩层弹窗

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

  7. jquery 遮罩层指定位置

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

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

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

  9. jquery实现div遮罩层

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

随机推荐

  1. fir分布式滤波的fpga实现

    此设计的结构包括:1.移位寄存器链,n阶的有n-1个寄存器. 2.第一次累加部分.由fir滤波系数对称可得到对称的寄存器相加可以减小电路规模,所以第一次累加很有必要. 3,锁存并移位部分.此部分是为了 ...

  2. Spring中类型自动装配--byType

    在Spring中,“类型自动装配”的意思是如果一个bean的数据类型与其它bean属性的数据类型相同,将自动兼容装配它. 例如,一个“persion” bean 公开以“ability”类数据类型作为 ...

  3. Kata 架构

    原文:https://github.com/kata-containers/documentation/blob/master/architecture.md (欢迎纠错) Kata-runtime ...

  4. django-settings.py配置

    django settings 详细资料 ############ 开始项目 python3.5 pip -m install django==1.11.7 指定版本安装 pip3 install d ...

  5. C#一个判断子串在父串中出现的次数

    /// <summary> /// 计算字符串中子串出现的次数 /// </summary> /// <param name=”str”>字符串</param ...

  6. python学习(八) 异常

    8.1 什么是异常 8.2 按自己的方式出错 如何引发异常,以及创建自己的异常类型. 8.2.1 raise语句 >>> raise Exception Traceback (mos ...

  7. Java面试(二)

    1 同步方法 VS 同步代码块: java中,每一个对象都有一把锁,线程用synchronized获取对象上的锁. 非静态同步方法:锁是类的对象的锁. 静态同步方法:锁的是类本身. 同步方法块:锁是可 ...

  8. Py修行路 python基础 (二十四)socket编程

    socket编程 一.客户端/服务端架构 客户端/服务端架构 即C/S架构,包括:1.硬件C/S架构,2.软件C/S架构. 互联网中处处都是C/S架构,学习socket 就是为了完成C/S架构的开发. ...

  9. 关于XSS漏洞的简介以及分类

    不得不说注入的时代已经过去了,最近xss貌似比较热门.我就去恶补了一下,我表示我只是菜鸟,对xss不了解.所以从最基本的学起. 什么xss漏洞? 一.XSS攻击简介 作为一种HTML注入攻击,XSS攻 ...

  10. MAPREDUCE的实战案例

    reduce端join算法实现 1.需求: 订单数据表t_order: id date pid amount 1001 20150710 P0001 2 1002 20150710 P0001 3 1 ...