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 相关文章推荐
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
Aug 14 Javascript
jQuery 解析xml文件
Aug 09 Javascript
用Javascript实现Windows任务管理器的代码
Mar 27 Javascript
jquery中加载图片自适应大小主要实现代码
Aug 23 Javascript
一道常被人轻视的web前端常见面试题(JS)
Feb 15 Javascript
JS上传组件FileUpload自定义模板的使用方法
May 10 Javascript
微信小程序 swiper制作tab切换实现附源码
Jan 21 Javascript
jQuery中each遍历的三种方法实例分析
Sep 07 jQuery
深入理解JS异步编程-Promise
Jun 03 Javascript
JavaScript获取页面元素的常用方法详解
Sep 28 Javascript
微信小程序图片右边加两行文字的代码
Apr 23 Javascript
JavaScript面向对象核心知识与概念归纳整理
May 09 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
YB217、YB235、YB400浅听
2021/03/02 无线电
PHP不用递归遍历目录下所有文件的代码
2014/07/04 PHP
php结合正则批量抓取网页中邮箱地址
2015/05/19 PHP
PHP如何实现Unicode和Utf-8编码相互转换
2015/07/29 PHP
PHP设计模式之迭代器模式
2016/06/17 PHP
PHP关键特性之命名空间实例详解
2017/05/06 PHP
读jQuery之二(两种扩展)
2011/06/11 Javascript
jquery 关于event.target使用的几点说明介绍
2013/04/26 Javascript
js数组操作常用方法
2014/05/08 Javascript
JQuery简单实现锚点链接的平滑滚动
2015/05/03 Javascript
纯js的右下角弹窗实例
2017/03/12 Javascript
纯html+css+javascript实现楼层跳跃式的页面布局(实例代码)
2017/10/25 Javascript
Vue2.0 axios前后端登陆拦截器(实例讲解)
2017/10/27 Javascript
vue中进入详情页记住滚动位置的方法(keep-alive)
2018/09/21 Javascript
javascript自定义右键菜单插件
2019/12/16 Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
2020/03/07 Javascript
[05:41]2014DOTA2西雅图国际邀请赛 小组赛7月10日TOPPLAY
2014/07/10 DOTA
python算法学习之基数排序实例
2013/12/18 Python
Python中获取对象信息的方法
2015/04/27 Python
python实现下载指定网址所有图片的方法
2015/08/08 Python
深入理解python中的浅拷贝和深拷贝
2016/05/30 Python
python虚拟环境的安装配置图文教程
2017/10/20 Python
Numpy中的mask的使用
2018/07/21 Python
django如何连接已存在数据的数据库
2018/08/14 Python
Python定义函数实现累计求和操作
2020/05/03 Python
连卡佛中国官网:Lane Crawford中文站
2018/01/27 全球购物
Qoo10台湾站:亚洲领先的在线市场
2018/05/15 全球购物
马德里著名的运动鞋商店:NOIRFONCE
2019/04/12 全球购物
加拿大在线隐形眼镜和眼镜店:VisionPros
2019/10/06 全球购物
教学个人的自我评价分享
2014/02/16 职场文书
商场开业庆典策划方案
2014/06/02 职场文书
乒乓球兴趣小组活动总结
2014/07/08 职场文书
殡葬服务心得体会
2014/09/11 职场文书
辞职信范文大全
2015/03/02 职场文书
2015年共青团工作总结
2015/05/15 职场文书
如何解决springcloud feign 首次调用100%失败的问题
2021/06/23 Java/Android