js工具方法弹出蒙版


Posted in Javascript onMay 08, 2013
//工具方法弹出蒙版 add by dning 2012-11-4
var maskShow = (function () {
    var mask = null;
    var curr = null;
    var free = false;
    var func = {
        onresize: null,
        onscroll: null
    };
    return function (el, fre, Type) {
        if (!mask) {
            initMask();
        }
        free = !!fre;
        if (el == null) {
            show(curr, false);
            show(mask, false);
            showSelects(true); //for ie6
            curr = null;
            if (!free) for (var s in func) {
                window[s] = func[s];
                func[s] = null;
            }
        } else {
            if (curr)
                show(curr, false);
            curr = $(el)[0];
            checkVisib(curr);
            rePos();
            mask.style.zIndex = maskShow.zIndexBack || 15;
            curr.style.zIndex = maskShow.zIndexFore || 20;
            show(curr, true);
            show(mask, true);
            showSelects(false, el); //for ie6
            if (!free) for (var s in func) {
                func[s] = window[s];
                window[s] = rePos;
            }
        }
        if (Type == 0) {
            mask.style.width = document.body.clientWidth + 'px';
            mask.style.height = document.body.clientHeight + 'px';
            if (el) el.style.position = "fixed";
        } else {
            mask.style.width = "0px";
            mask.style.height = "0px";
            if (el) el.style.position = "absolute";
        }
    };
    function showSelects(b, box) {
        if (!browser.IE6) return;
        var sel = document.getElementsByTagName('select');
        var vis = b ? 'visible' : 'hidden';
        for (var i = 0; i < sel.length; i++) {
            if ((b || !childOf(sel[i], box)) && sel[i].currentStyle.visibility != vis) sel[i].style.visibility = vis;
        }
    }
    function childOf(a, b) {
        while (a && a != b) a = a.parentNode;
        return a == b;
    }
    function initMask() {
        /*
        mask=document.createElement('iframe');
        mask.src='://0';
        */
        mask = document.createElement('div');
        mask.style.cssText = 'background-color:{$c};border:none;position:absolute;visibility:hidden;opacity:{$a};filter:alpha(opacity={$A})'.replaceWith({
            c: maskShow.bgColor || '#000',
            a: maskShow.bgAlpha || '0.5',
            A: maskShow.bgAlpha ? parseInt(maskShow.bgAlpha * 100) : '50'
        }); 
        document.body.appendChild(mask);
        maskShow.mask = mask;
    }
    function checkVisib(el) {
        var sty = el.style;
        sty.position = 'absolute';
        sty.left = '-10000px';
        sty.top = '-10000px';
        sty.visibility = 'visible';
        sty.display = 'block';
        sty.zIndex = 10;
    }
    function rePos() {
        if (!curr) return;
        var ps = $pageSize('doc');
        setRect(mask, ps);
        var rc = centerPos(ps, curr.offsetWidth, curr.offsetHeight);
        if (rc.left < ps.scrollLeft) rc.left = ps.scrollLeft;
        if (rc.top < ps.scrollTop) rc.top = ps.scrollTop;
        setRect(curr, rc);
    }
    function centerPos(ps, cw, ch) {
        return {
            left: ((ps.winWidth - cw) >> 1) + ps.scrollLeft + (maskShow.adjustX || 0),
            top: ((ps.winHeight - ch) >> 1) + ps.scrollTop + (maskShow.adjustY || 0)
        };
    }
    function setRect(el, rect) {
        var sty = el.style;
        sty.left = (rect.left || 0) + 'px';
        sty.top = (rect.top || 0) + 'px';
        if ('width' in rect)
            sty.width = rect.width + 'px';
        if ('height' in rect)
            sty.height = rect.height + 'px';
    }
    function show(el, b) {
        if (!el) return;
        el.style.visibility = 'visible';
        if (!b) {
            el.style.left = -el.offsetWidth - 100 + 'px';
            el.style.top = -el.offsetHeight - 100 + 'px';
        }
    }
})();
Javascript 相关文章推荐
JavaScript高级程序设计(第3版)学习笔记2 js基础语法
Oct 11 Javascript
JavaScript高级程序设计(第3版)学习笔记7 js函数(上)
Oct 11 Javascript
浅析Js中的单引号与双引号问题
Nov 06 Javascript
正则表达式,替换所有HTML标签的简单实例
Nov 28 Javascript
JavaScript字符串_动力节点Java学院整理
Jun 27 Javascript
Angular2+如何去除url中的#号详解
Dec 20 Javascript
基于vue-video-player自定义播放器的方法
Mar 21 Javascript
jQuery实现ajax回调函数带入参数的方法示例
Jun 26 jQuery
ES6入门教程之变量的解构赋值详解
Apr 13 Javascript
详细教你微信公众号正文页SVG交互开发技巧
Jul 25 Javascript
KnockoutJS数组比较算法实例详解
Nov 25 Javascript
JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法
Apr 13 Javascript
基于JavaScript 声明全局变量的三种方式详解
May 07 #Javascript
你必须知道的JavaScript 变量命名规则详解
May 07 #Javascript
你必须知道的JavaScript 中字符串连接的性能的一些问题
May 07 #Javascript
基于JavaScript实现继承机制之构造函数方法对象冒充的使用详解
May 07 #Javascript
基于JavaScript实现继承机制之调用call()与apply()的方法详解
May 07 #Javascript
JS中的substring和substr函数的区别说明
May 07 #Javascript
js图片自动切换效果处理代码
May 07 #Javascript
You might like
CPU步进是什么意思?i3-9100F B0步进和U0步进区别知识科普
2020/03/17 数码科技
用Flash图形化数据(二)
2006/10/09 PHP
第十一节--重载
2006/11/16 PHP
使用 eAccelerator加速PHP代码的目的
2007/03/16 PHP
PHP伪造referer实例代码
2008/09/20 PHP
PHP中基本HTTP认证技巧分析
2015/03/16 PHP
PHP模板引擎Smarty内建函数foreach,foreachelse用法分析
2016/04/11 PHP
PHP读取大文件末尾N行的高效方法推荐
2016/06/03 PHP
Javascript面象对象成员、共享成员变量实验
2010/11/19 Javascript
原生javascript实现无间缝滚动示例
2014/01/28 Javascript
Jquery插件分享之气泡形提示控件grumble.js
2014/05/20 Javascript
Underscore.js 1.3.3 中文注释翻译说明
2015/06/25 Javascript
Bootstrap笔记之缩略图、警告框实例详解
2017/03/09 Javascript
详解Angular CLI + Electron 开发环境搭建
2017/07/20 Javascript
简单的网页广告特效实例
2017/08/19 Javascript
解决vue项目中type=”file“ change事件只执行一次的问题
2018/05/16 Javascript
js限制输入框只能输入数字(onkeyup触发)
2018/09/28 Javascript
解决微信小程序调用moveToLocation失效问题【超简单】
2019/04/12 Javascript
JS实现移动端在线签协议功能
2019/08/22 Javascript
python网络编程之UDP通信实例(含服务器端、客户端、UDP广播例子)
2014/04/25 Python
python中函数默认值使用注意点详解
2016/06/01 Python
python+selenium实现登录账户后自动点击的示例
2017/12/22 Python
Python中.join()和os.path.join()两个函数的用法详解
2018/06/11 Python
关于Python核心框架tornado的异步协程的2种方法详解
2019/08/28 Python
python读取多层嵌套文件夹中的文件实例
2020/02/27 Python
pycharm中import呈现灰色原因的解决方法
2020/03/04 Python
使用Python将图片转正方形的两种方法实例代码详解
2020/04/29 Python
浅谈keras中的keras.utils.to_categorical用法
2020/07/02 Python
python 爬取B站原视频的实例代码
2020/09/09 Python
Zadig&Voltaire官网:法国时装品牌
2018/01/05 全球购物
抽样调查项目计划书
2014/04/24 职场文书
电话客服工作职责
2014/07/27 职场文书
2014年仓库管理工作总结
2014/12/17 职场文书
浅谈Python数学建模之线性规划
2021/06/23 Python
javascript条件式访问属性和箭头函数介绍
2021/11/17 Javascript
centos环境下nginx高可用集群的搭建指南
2022/07/23 Servers