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 相关文章推荐
自动更新作用
Oct 08 Javascript
JSON取值前判断
Dec 23 Javascript
JavaScript调用浏览器打印功能实例分析
Jul 17 Javascript
JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果
Nov 26 Javascript
js如何改变文章的字体大小
Jan 08 Javascript
JS实现点击登录弹出窗口同时背景色渐变动画效果
Mar 25 Javascript
详解vue跨组件通信的几种方法
Jun 15 Javascript
vue2.0 如何把子组件的数据传给父组件(推荐)
Jan 15 Javascript
记一次webapck4 配置文件无效的解决历程
Sep 19 Javascript
vue路由权限校验功能的实现代码
Jun 07 Javascript
jQuery 添加元素和删除元素的方法
Jul 15 jQuery
keep-alive保持组件状态的方法
Dec 02 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
用PHP读取IMAP邮件
2006/10/09 PHP
简化php模板页面中分页代码的解析
2009/02/06 PHP
使用PHP编写的SVN类
2013/07/18 PHP
PHP tp5中使用原生sql查询代码实例
2020/10/28 PHP
jquery mobile 实现自定义confirm确认框效果的简单实例
2016/06/17 Javascript
JavaScript数据操作_浅谈原始值和引用值的操作本质
2016/08/23 Javascript
用headjs来管理和加载js 提高网站加载速度
2016/11/29 Javascript
Bootstrap3下拉菜单的实现
2017/02/22 Javascript
从零学习node.js之利用express搭建简易论坛(七)
2017/02/25 Javascript
jQuery实现checkbox即点即改批量删除及中间遇到的坑
2017/11/11 jQuery
基于vue-ssr的静态网站生成器VuePress 初体验
2018/04/17 Javascript
uni app仿微信顶部导航条功能
2019/09/17 Javascript
JS使用正则表达式判断输入框失去焦点事件
2019/10/16 Javascript
Vue组件间的通信pubsub-js实现步骤解析
2020/03/11 Javascript
基于JavaScript实现十五拼图代码实例
2020/04/26 Javascript
vue项目中使用bpmn-自定义platter的示例代码
2020/05/11 Javascript
多个Vue项目部署到服务器的步骤记录
2020/10/22 Javascript
通过mod_python配置运行在Apache上的Django框架
2015/07/22 Python
python函数局部变量用法实例分析
2015/08/04 Python
Python之dict(或对象)与json之间的互相转化实例
2018/06/05 Python
Python3模拟登录操作实例分析
2019/03/12 Python
Python for循环与range函数的使用详解
2019/03/23 Python
pytorch中交叉熵损失(nn.CrossEntropyLoss())的计算过程详解
2020/01/02 Python
Python连接SQLite数据库并进行增册改查操作方法详解
2020/02/18 Python
Python中remove漏删和索引越界问题的解决
2020/03/18 Python
django ListView的使用 ListView中获取url中的参数值方式
2020/03/27 Python
django项目中使用云片网发送短信验证码的实现
2021/01/19 Python
Django和Ueditor自定义存储上传文件的文件名
2021/02/25 Python
美国玩具公司:U.S.Toy
2018/05/19 全球购物
波兰最早的运动鞋精品店之一:Street Supply
2019/08/29 全球购物
2014年环境卫生工作总结
2014/11/24 职场文书
党员个人年度总结
2015/02/14 职场文书
公司内部升职自荐信
2015/03/27 职场文书
导游词之岳阳楼
2019/09/25 职场文书
MySQL里面的子查询的基本使用
2021/08/02 MySQL
微软Win11什么功能最惊艳? Windows11新功能特性汇总
2021/11/21 数码科技