jquery实现遮罩层

jquery确实是个好东西，引用了它之后在页面上写脚本方便多了，而且它的ui插件特别丰富，你想要的效果几乎它都帮你实现了，如果你不想用它的插件，自己扩展也很方便。

我自己写了一个测试遮罩层的页面，开始总是在样式里设定好遮罩层的宽度和高度，可是如果显示器的尺寸不一样的话，这个遮罩层就会出现有些地方没有被遮住，看网上很多人的例子也会出现这样的问题，于是看看jquery相关的demo，发现并不会出现此类问题，看它的源代码，呵呵，原来是在打开遮罩层的时候才去设定遮罩层的宽度和高度，而且它的源代码是兼容了多种浏览器，不错，可以直接拿过来用用。
脚本代码如下：

    $("#divOverlay").css("width", width());
    $("#divOverlay").css("height", height());
    function height() {
        // handle IE 6
        //alert($.browser.msie);
        if ($.browser.msie && $.browser.version < 7) {
            var scrollHeight = Math.max(
                document.documentElement.scrollHeight,
                document.body.scrollHeight
            );
            var offsetHeight = Math.max(
                document.documentElement.offsetHeight,
                document.body.offsetHeight
            );
            if (scrollHeight < offsetHeight) {
                return $(window).height() + 'px';
            } else {
                return scrollHeight + 'px';
            }
            // handle "good" browsers
        } else {
            return $(document).height() + 'px';
        }
    }

    function width() {
        // handle IE 6
        if ($.browser.msie && $.browser.version < 7) {
            var scrollWidth = Math.max(
                document.documentElement.scrollWidth,
                document.body.scrollWidth
            );
            var offsetWidth = Math.max(
                document.documentElement.offsetWidth,
                document.body.offsetWidth
            );

            if (scrollWidth < offsetWidth) {
                return $(window).width() + 'px';
            } else {
                return scrollWidth + 'px';
            }
            // handle "good" browsers
        } else {
            return $(document).width() + 'px';
        }
    }

css代码：

        #divOverlay
        {
            background-color: #cccccc;
            position: absolute;
            filter: alpha(opacity:50);
            khtmlopacity: 0.5;
            mozopacity: 0.5;
            opacity: 0.5;
            top: 0;
            left: 0;
            z-index: 999px;
        }