(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. 【sqlite】错误代码整理

    这两天为了一个问题折腾了好久,记载一下. SQLite语句一定要严格按例子来写,例如: "CREATE TABLE PunchData (Id Text primary key, Heigh ...

  2. ACM学习历程—51NOD 1685 第K大区间2(二分 && 树状数组 && 中位数)

    http://www.51nod.com/contest/problem.html#!problemId=1685 这是这次BSG白山极客挑战赛的E题. 这题可以二分答案t. 关键在于,对于一个t,如 ...

  3. LG4360 [CEOI2004]锯木厂选址

    题意 原题来自:CEOI 2004 从山顶上到山底下沿着一条直线种植了 n 棵老树.当地的政府决定把他们砍下来.为了不浪费任何一棵木材,树被砍倒后要运送到锯木厂. 木材只能朝山下运.山脚下有一个锯木厂 ...

  4. 阿里云接口异常-Can not find endpoint to access

    最近在做公司的资产盘点,需要请求阿里云的接口获取公司的云服务器信息.在获取实例列表的过程中,通过异常机制捕获了 Can not find endpoint to access 这个错误.经过多次排查, ...

  5. 为IIS Host ASP.NET Web Api添加Owin Middleware

    将OWIN App部署在IIS上 要想将Owin App部署在IIS上,只添加Package:Microsoft.OWIN.Host.SystemWeb包即可.它提供了所有Owin配置,Middlew ...

  6. 字符串长度(PHP学习)

    1.计算字符串长度有哪些方法? 答:strlen()   和  mb_strlen() 2.两者有什么区别 答: 如下代码 <?php $str = 'hello中国'; ?> strle ...

  7. PHP中的use、命名空间的理解

    看.Net中的命名空间和using using Ddd.Core; using Ddd.Core.Caching; using Ddd.Core.Data; using Ddd.Core.Domain ...

  8. Linux MTD系统剖析

    MTD,Memory Technology Device即内存技术设备,在Linux内核中,引入MTD层为NOR FLASH和NAND FLASH设备提供统一接口.MTD将文件系统与底层FLASH存储 ...

  9. U-boot分析与移植(3)----U-boot stage2分析

    一来到void start_armboot (void)函数,马上出现两个很重要的数据结构gd_t和bd_t 1.gd_t : global data数据结构定义,位于文件 include/asm-a ...

  10. Ehcache入门介绍一

    EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernate中默认的CacheProvider. 特性有: 1. 快速轻量 Ehcache的线程机制是为大型高并发系统设 ...