js工具方法弹出蒙版

 更新时间:2013年05月08日 10:29:27   作者:  
js工具方法弹出蒙版,需要的朋友可以参考一下
复制代码 代码如下:

//工具方法弹出蒙版 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';
        }
    }
})();

相关文章

  • PHP 与 js的通信(via ajax,json)

    PHP 与 js的通信(via ajax,json)

    一定要设置xmlHttp.setRequestHeader,否则传往PHP的参数会变成null(line 38)
    2010-11-11
  • js中的getElementById的使用方法

    js中的getElementById的使用方法

    getElementById是JavaScript中的一个DOM方法,用于根据元素的id属性获取HTML文档中的元素,本文给大家介绍js中的getElementById的使用方法,感兴趣的朋友一起看看吧
    2023-10-10
  • 使用HTML5+Boostrap打造简单的音乐播放器

    使用HTML5+Boostrap打造简单的音乐播放器

    这篇文章主要介绍了使用HTML5+Boostrap打造简单的音乐播放器 的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-08-08
  • 微信小程序如何利用getCurrentPages进行页面传值

    微信小程序如何利用getCurrentPages进行页面传值

    这篇文章主要介绍了微信小程序如何利用getCurrentPages进行页面传值,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-07-07
  • JavaScript实现打地鼠游戏

    JavaScript实现打地鼠游戏

    这篇文章主要为大家详细介绍了JavaScript实现打地鼠游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-10-10
  • JS打印组合功能

    JS打印组合功能

    这篇文章主要介绍了JS打印组合功能,包括JS实现简单的页面局部打印,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • JS格式化字符串的两种方法(反引号与String.prototype)

    JS格式化字符串的两种方法(反引号与String.prototype)

    本文一共介绍了两种实现方式,使用反引号或自定义方法实现,需要的朋友可以参考下
    2023-06-06
  • js页面加载后执行的几种方式小结

    js页面加载后执行的几种方式小结

    在实际应用中往往需要在页面加载完毕之后再去执行相关的js代码,之所以这么操作是有道理的,如果是操作dom元素,如果相关元素没有加载完成,而去执行js代码,可能会导致错误
    2020-01-01
  • 页面版文本框智能提示JS代码

    页面版文本框智能提示JS代码

    首先说下背景,该code用于一个多条件查询界面,原本该查询条件由一个下拉列表提供,但是由于下拉列表数据量过大,用户使用不方便,便希望在页面给出一个智能提示的功能,但搜索的数据来自下拉列表
    2009-11-11
  • JavaScript字符串截取方法总结(slice、substring、substr等)

    JavaScript字符串截取方法总结(slice、substring、substr等)

    在开发中常常会需要截取字符串,而 JavaScript 提供了很多种方法实现截取操作,本文对各种方法做个整理,文中通过代码示例给大家介绍的非常详细,需要的朋友可以参考下
    2024-01-01

最新评论